কম্পিউটার

CSS দিয়ে অ্যানিমেশনের গতি বক্ররেখা উল্লেখ করুন


অ্যানিমেশন-টাইমিং-ফাংশন ব্যবহার করুন অ্যানিমেশনের গতি বক্ররেখা সেট করতে। আপনি এটি অর্জন করতে নিম্নলিখিত কোড চালানোর চেষ্টা করতে পারেন

উদাহরণ

<!DOCTYPE html>
<html>
   <head>
      <style>
         div {
            width: 150px;
            height: 200px;
            position: relative;
            background-color: yellow;
            animation-name: myanim;
            animation-duration: 2s;
            animation-direction: alternate-reverse;
            animation-iteration-count: 3;
         }
         @keyframes myanim {
            from {left: 100px;}
            to {left: 200px;}
         }
         #demo1 {animation-timing-function: ease;}
         #demo2 {animation-timing-function: ease-in;}
      </style>
   </head>
   <body>
      <div id = "demo1">ease effect</div>
      <div id = "demo2">ease-in effect</div>
   </body>
</html>

  1. সিএসএস দিয়ে কন্টেইনারের শেষে ফ্লেক্স আইটেমগুলি সারিবদ্ধ করুন

  2. সিএসএস দিয়ে কন্টেইনারের শুরুতে ফ্লেক্স আইটেমগুলি সারিবদ্ধ করুন

  3. CSS দিয়ে অনুভূমিকভাবে ফ্লেক্স আইটেম সেট করুন

  4. CSS সহ কন্টেইনারের শুরুতে ফ্লেক্স লাইনগুলি প্রদর্শন করুন