【问题标题】:Can i animated or transform a shadow我可以动画或变换阴影吗
【发布时间】:2022-02-14 09:10:03
【问题描述】:

我想问一些事情。我可以用 css 在阴影上添加动画样式吗?动画我的意思是阴影可以多次淡入淡出。

<!DOCTYPE html>
<html>
<head>
<style>
h1 {
  text-shadow: 2px 2px;
}
</style>
</head>
<body>

<h1>Text-shadow effect!</h1>

</body>
</html>

【问题讨论】:

    标签: javascript html css


    【解决方案1】:

    是的,你可以。你可以使用@keyframes

    h1 {
      animation: shadow-animate 3s infinite ease;
    }
    
    @keyframes shadow-animate {
      0% {
        text-shadow: 20px 20px;
      }
      
      100% {
        text-shadow: 0px 0px
      }
    }
    <!DOCTYPE html>
    <html>
    <head>
    </head>
    <body>
    
    <h1>Text-shadow effect!</h1>
    
    </body>
    </html>

    【讨论】:

      猜你喜欢
      • 2011-07-29
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-02-12
      • 1970-01-01
      • 2017-08-03
      相关资源
      最近更新 更多