css实现渐渐消失的方法:首先用“@keyframes”规则和animation属性定义动画;然后在动画开始部分添加“opacity:1;”样式,设置正常状态;最后在动画结束部分添加“opacity:0;”样式,设置完全透明状态,隐藏元素。
大前端成长进阶课程:进入学习
本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。
.hideSlow{ background: #a40808; color: #fff; animation: hidetip 5s 1; animation-fill-mode: forwards; -webkit-animation: showtip 5s 1; -webkit-animation-fill-mode: forwards; } @keyframes hidetip { from { opacity: 1; } to { opacity: 0; } } @-webkit-keyframes hidetip { from { opacity: 1; } to { opacity: 0; } }
推荐学习:css视频教程
以上就是css如何实现渐渐消失的详细内容,更多请关注php中文网其它相关文章!
前端(VUE)零基础到就业课程:点击学习
自己动手写 PHP MVC 框架:点击学习
![](http://m.sbmmt.com/img/upload/article/000/000/020/633501a29d313483.png)