Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> CSS

Tạo hiệu ứng chuyển động cho thuộc tính CSS perspective


Để thực hiện animation trên thuộc tính perspective với CSS, bạn có thể chạy đoạn mã sau:

Ví dụ

<!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>