CSS3实现闪烁动画效果的方法
内容摘要
本文实例讲述了CSS3实现闪烁动画效果的方法。分享给大家供大家参考。具体方法如下：
给class属性名为className的元素添加闪烁动画效果
复制代码代码如下:.className{
-web
给class属性名为className的元素添加闪烁动画效果
复制代码代码如下:.className{
-web
文章正文
本文实例讲述了CSS3实现闪烁动画效果的方法。分享给大家供大家参考。具体方法如下：
给class属性名为className的元素添加闪烁动画效果
复制代码
代码如下:.className{
-webkit-animation: twinkling 1s infinite ease-in-out
}
.animated{
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both
}
@-webkit-keyframes twinkling{
0%{
opacity: 0.5;
}
100%{
opacity: 1;
}
}
@keyframes twinkling{
0%{
opacity: 0.5;
}
100%{
opacity: 1;
}
}
-webkit-animation: twinkling 1s infinite ease-in-out
}
.animated{
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both
}
@-webkit-keyframes twinkling{
0%{
opacity: 0.5;
}
100%{
opacity: 1;
}
}
@keyframes twinkling{
0%{
opacity: 0.5;
}
100%{
opacity: 1;
}
}
希望本文所述对大家基于css的网页设计有所帮助。
代码注释
作者：喵哥笔记
