对 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 次浏览

开启你的 事业

完成此课程以获得认证

立即开始
广告