风景旧曾谙,阳春三月归;烟云十年后,又见江南花。夜晚的这一刻,我独赏风景。有很多人觉得,一个人旅行好无聊。可我却偏偏喜欢一个人。
本文实例讲述了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的网页设计有所帮助。
到此这篇关于CSS3如何实现闪烁动画效果的方法就介绍到这了。与其指望遇到一个谁,不如指望自己能够吸引那样的人;与其指望每次失落的时候会有正能量出现温暖自己,不如指望自己变成一个正能量满满的人;与其担心未来,不如现在好好努力。更多相关CSS3如何实现闪烁动画效果的方法内容请查看相关栏目,小编编辑不易,再次感谢大家的支持!