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实现跳动的动画效果
Sep 12 HTML / CSS
CSS3地图动态实例代码(圆圈向外扩散)
Jun 15 HTML / CSS
CSS3模块的目前的状况分析
Feb 24 HTML / CSS
纯CSS实现菜单、导航栏的3D翻转动画效果
Apr 23 HTML / CSS
纯CSS3制作漂亮带动画效果的主机价格表
Apr 25 HTML / CSS
CSS3径向渐变之大鱼吃小鱼之孤单的大鱼
Apr 26 HTML / CSS
css3实现多个元素依次显示效果
Dec 12 HTML / CSS
html标签之Object和EMBED标签详解
Jul 04 HTML / CSS
HTML5的download属性详细介绍和使用实例
Apr 23 HTML / CSS
html5中JavaScript removeChild 删除所有节点
May 16 HTML / CSS
HTML5 canvas基本绘图之图形组合
Jun 27 HTML / CSS
利用canvas实现图片压缩的示例代码
Jul 17 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
用PHP 4.2书写安全的脚本
2006/10/09 PHP
PHP如何通过AJAX方式实现登录功能
2015/11/23 PHP
Yii2框架使用计划任务的方法
2016/05/25 PHP
PHP实现绘制二叉树图形显示功能详解【包括二叉搜索树、平衡树及红黑树】
2017/11/16 PHP
JavaScript面象对象设计
2008/04/28 Javascript
JavaScript 学习笔记(十二) dom
2010/01/21 Javascript
javascript代码编写需要注意的7个小细节小结
2011/09/21 Javascript
使用jquery hover事件实现表格的隔行换色功能示例
2013/09/03 Javascript
jQuery控制TR显示隐藏的三种常用方法
2014/08/21 Javascript
jQuery插件jPaginate实现无刷新分页
2015/05/04 Javascript
jQuery平滑旋转幻灯片特效代码分享
2015/09/07 Javascript
原生JS实现的放大镜效果实例代码
2016/10/15 Javascript
jQuery时间验证和转换为标准格式的时间格式
2017/03/06 Javascript
解析Vue2 dist 目录下各个文件的区别
2017/11/22 Javascript
JavaScript实现矩形块大小任意缩放
2020/08/25 Javascript
[02:17]DOTA2亚洲邀请赛 RAVE战队出场宣传片
2015/02/07 DOTA
python实现用户答题功能
2018/01/17 Python
django初始化数据库的实例
2018/05/27 Python
Python面向对象程序设计示例小结
2019/01/30 Python
python利用多种方式来统计词频(单词个数)
2019/05/27 Python
Python实现随机生成任意数量车牌号
2020/01/21 Python
django处理select下拉表单实例(从model到前端到post到form)
2020/03/13 Python
将tf.batch_matmul替换成tf.matmul的实现
2020/06/18 Python
PyTorch如何搭建一个简单的网络
2020/08/24 Python
使用CSS3制作一个简单的进度条(demo)
2017/05/23 HTML / CSS
台湾最大网路书店:博客来
2018/03/18 全球购物
英国天然宝石首饰购买网站:Gemondo Jewellery
2018/10/23 全球购物
高中毕业生自我鉴定范文
2013/09/26 职场文书
应聘面试自我评价
2014/01/24 职场文书
电力公司个人求职信范文
2014/02/04 职场文书
爱护草坪标语
2014/06/24 职场文书
学生安全责任书模板
2014/07/25 职场文书
大学军训通讯稿
2015/07/18 职场文书
学会掌握自己命运的十条黄金法则:
2019/08/08 职场文书
面试提问mysql一张表到底能存多少数据
2022/03/13 MySQL
Spring Boot 底层原理基础深度解析
2022/04/03 Java/Android