Computer >> คอมพิวเตอร์ >  >> การเขียนโปรแกรม >> CSS

ทำแอนิเมชั่นบน CSS min-width


ในการใช้แอนิเมชั่นบนคุณสมบัติความกว้างขั้นต่ำด้วย CSS คุณสามารถลองเรียกใช้โค้ดต่อไปนี้

ตัวอย่าง

<!DOCTYPE html>
<html>
   <head>
      <style>
         div {
            overflow: auto;
            width: 50%;
            background-color: blue;
            color: white;
            border: 1px solid black;
            animation: myanim 3s infinite;
         }
         @keyframes myanim {
            30% {
               min-width: 550px;
            }
         }
      </style>
   </head>
   <body>
      <h1>Example of min-width</h1>
      <div>
         <p>This is demo text. This is demo text. This is demo text.
            This is demo text. This is demo text. This is demo text.
            This is demo text. This is demo text. This is demo text.
            This is demo text. This is demo text. This is demo text.
            This is demo text. This is demo text. This is demo text.
            This is demo text. This is demo text. This is demo text.
            This is demo text. This is demo text. This is demo text.
         </p>
      </div>
   </body>
</html>