কম্পিউটার টিউটোরিয়াল

CSS perspective প্রপার্টিতে অ্যানিমেশন করুন


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

উদাহরণ

<!DOCTYPE html>
<html>
  <head>
    <style>
      #demo1 {
        position: relative;
        margin-left: 120px;
        height: 250px;
        width: 350px;
        padding: 10px;
        border: 1px solid orange;
        animation: myanim 3s infinite;
        perspective: 200px;
      }
      @keyframes myanim {
        50% {
          perspective: 100px;
        }
      }
      #demo2 {
        padding: 90px;
        position: absolute;
        border: 1px solid black;
        background-color: orange;
        transform: rotateX(60deg);
      }
    </style>
  </head>
  <body>
    <div id="demo1">This is demo text in div1. <div id="demo2">This is demo text in div2.</div> </div>
  </body>
</html>

  1. CSS margin-right প্রপার্টিতে অ্যানিমেশন করুন

  2. CSS opacity প্রপার্টিতে অ্যানিমেশন করুন

  3. CSS perspective-origin প্রপার্টিতে অ্যানিমেশন করুন

  4. CSS padding-top প্রপার্টিতে অ্যানিমেশন করুন