CSS3实现闪烁动画效果的方法


Posted in HTML / CSS onFebruary 09, 2015

本文实例讲述了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的网页设计有所帮助。

HTML / CSS 相关文章推荐
css3实现可滑动跳转的分页插件示例
May 08 HTML / CSS
详解CSS3中Media Queries的相关使用
Jul 17 HTML / CSS
CSS3中使用RGBA设置透明度的示例
Aug 04 HTML / CSS
深入浅析CSS3中的Flex布局整理
Apr 27 HTML / CSS
使用phonegap检测网络状态的方法
Mar 30 HTML / CSS
html5 worker 实例(二) 图片变换效果
Jun 24 HTML / CSS
HTML5和以前HTML4的区别整理
Oct 20 HTML / CSS
浅析HTML5中header标签的用法
Jun 24 HTML / CSS
微信端html5页面调用分享接口示例
Mar 14 HTML / CSS
关于canvas.toDataURL 在iOS运行失败的问题解决
Sep 16 HTML / CSS
html+css合并表格边框的示例代码
Mar 31 HTML / CSS
css中:last-child不生效的解决方法
Aug 05 HTML / CSS
CSS3使用transition实现的鼠标悬停淡入淡出
Jan 09 #HTML / CSS
一款基于css3和jquery实现的动画显示弹出层按钮教程
Jan 04 #HTML / CSS
一款利用html5和css3实现的3D滚动特效的教程
Jan 04 #HTML / CSS
一款基于css3的列表toggle特效实例教程
Jan 04 #HTML / CSS
一款基于css3麻将筛子3D翻转特效的实例教程
Dec 31 #HTML / CSS
CSS Grid布局教程之网格单元格布局
Dec 30 #HTML / CSS
CSS Grid布局教程之浏览器开启CSS Grid Layout汇总
Dec 30 #HTML / CSS
You might like
一个图形显示IP的PHP程序代码
2007/10/19 PHP
php数组函数序列之end() - 移动数组内部指针到最后一个元素,并返回该元素的值
2011/10/31 PHP
Eclipse的PHP插件PHPEclipse安装和使用
2014/07/20 PHP
Zend Framework实现将session存储在memcache中的方法
2016/03/22 PHP
Laravel学习教程之request validation的编写
2017/10/25 PHP
PHP实现的ID混淆算法类与用法示例
2018/08/10 PHP
javascript编程起步(第四课)
2007/01/10 Javascript
一个判断email合法性的函数[非正则]
2008/12/09 Javascript
层序遍历在ExtJs的TreePanel中的应用
2009/10/16 Javascript
30个精美的jQuery幻灯片效果插件和教程
2011/08/23 Javascript
javascript时间自动刷新实现原理与步骤
2013/01/06 Javascript
纯JavaScript实现HTML5 Canvas六种特效滤镜示例
2013/06/28 Javascript
jQuery实现类似滑动门切换效果的层切换
2013/09/23 Javascript
Node.js与PHP、Python的字符处理性能对比
2014/07/06 Javascript
js创建表单元素并使用submit进行提交
2014/08/14 Javascript
jquery实现的省市区三级联动
2015/04/02 Javascript
字符串反转_JavaScript
2016/04/28 Javascript
jquery插件autocomplete用法示例
2016/07/01 Javascript
JavaScript中利用构造器函数模拟类的方法
2017/02/16 Javascript
jquery ui sortable拖拽后保存位置
2017/04/27 jQuery
js学使用setTimeout实现轮循动画
2017/07/17 Javascript
JS函数动态传递参数的方法分析【基于arguments对象】
2019/06/05 Javascript
[02:06]DOTA2英雄基础教程 暗影萨满
2013/12/16 DOTA
Python中的进程分支fork和exec详解
2015/04/11 Python
python机器学习理论与实战(一)K近邻法
2021/01/28 Python
WxPython建立批量录入框窗口
2019/02/27 Python
Python换行与不换行的输出实例
2020/02/19 Python
查找适用于matplotlib的中文字体名称与实际文件名对应关系的方法
2021/01/05 Python
国际象棋商店:The Chess Store
2018/07/09 全球购物
中文系师范生自荐信
2013/10/01 职场文书
大学生的网络创业计划书
2013/12/26 职场文书
新郎婚宴答谢词
2014/01/19 职场文书
房屋出租协议书
2014/04/10 职场文书
文体活动总结范文
2014/05/05 职场文书
个人工作主要事迹
2014/05/08 职场文书
Golang 空map和未初始化map的注意事项说明
2021/04/29 Golang