CSS3完成闪动动漫实际效果的方式

日期:2021-01-20 类型:科技新闻 

关键词:上线了小程序官网,年会抽奖小程序免费,做小程序,小程序网站,跑腿小程序

本文案例讲述了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;
}
}

期待本文所述对大伙儿根据css的网页页面设计方案有一定的协助。

上一篇:CSS3+js完成简易的数字时钟殊效 返回下一篇:没有了