對 CSS 行高屬性執行動畫

要透過 CSS 對line-height屬性實現動畫，你可以嘗試執行以下程式碼： -

示例

動態演示

<!DOCTYPE html>
<html>
   <head>
      <style>
         p {
            animation: mymove 3s infinite;
            line-height: 20px;
         }
         @keyframes mymove {
            70% {
               line-height: 50px;
            }
         }
      </style>
   </head>
   <body>
      <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!
      </p>
   </body>
</html>

更新於： 06-Jul-2020

446 次瀏覽

開啟你的 事業

完成此課程以獲得認證

立即開始
廣告