CSS order প্রপার্টি অ্যানিমেট করুন

CSS-এ order প্রপার্টিতে অ্যানিমেশন প্রয়োগ করতে নিচের কোডটি চালান:

উদাহরণ

<!DOCTYPE html>
<html>
  <head>
    <style>
      #demo1 {
        width: 600px;
        height: 180px;
        display: flex;
      }
      #inner {
        animation: myanim 3s infinite;
      }
      #demo1 div {
        width: 110px;
        height: 180px;
      }
      @keyframes myanim {
        30% {
          order: 4;
        }
      }
    </style>
  </head>
  <body>
    <h1>CSS order প্রপার্টি</h1>
    <div id="demo1">
      <div style="background-color:yellow;order:1;" id="inner"></div>
      <div style="background-color:blue;order:2;"></div>
      <div style="background-color:orange;order:3;"></div>
      <div style="background-color:pink;order:4;"></div>
      <div style="background-color:gray;order:5;"></div>
      <div style="background-color:maroon;order:6;" id="inner"></div>
    </div>
  </body>
</html>