Computer >> Máy Tính >  >> Lập trình >> CSS

Đặt thời lượng hoạt ảnh sẽ hoàn thành một chu kỳ bằng cách sử dụng CSS


Sử dụng thời lượng hoạt ảnh thuộc tính để đặt thời lượng hoạt ảnh sẽ hoàn thành một chu kỳ:

Ví dụ

<!DOCTYPE html>
<html>
   <head>
      <style>
         div {
            width: 150px;
            height: 200px;
            position: relative;
            background: red;
            animation-name: myanim;
            animation-duration: 2s;
         }
         @keyframes myanim {
            from {left: 0px; background-color: green;}
            to {left: 200px; background-color: blue;}
         }
      </style>
   </head>
   <body>
      <div> </div>
   </body>
</html>