平时写 css 很少,对很多 css 知识点都是一知半解,遇到问题都是百度-复制-粘贴……-_-||
css 过渡-transition 与 动画 animation 一直都没搞清楚,这两天学习了一下,其实还是好区分的,只是一直都没用心学习一下……
具体怎么理解,见仁见智,以下仅是个人理解。
transition 类似于 总结了最常用的一类 animation;然后,进行了简化,以方便使用。任何 transition 效果,都可以用 animation 实现。
首先,触发机制。transition 是依赖于现有的各种机制,可参考之前的文章《点击触发 css transition 过渡动画-触发方式小结》。animation 的触发机制则较为原始,只要设置了 animation 属性,动画就会触发。
其次,动画复杂度。animation 可以添加任意多的关键帧,而 transition 只有开始和结束两个关键帧。毫无疑问,animation 的动画复杂度远优于 transition。
最后,使用的便捷性,自然是 transition 比较简单。
-
css height 100% 无效解决方法如何让子元素撑满父元素
-
Typed.js打字效果js库的几种应用方式(7)我们可以通过css自定义指针样式,及css动画展示
-
jQuery 动画方法 animate 基础用法jQuery animate 方法简介
-
jQuery animate 动画 暂停 与 恢复执行jQuery animate 动画 暂停 与 恢复执行
-
css实现背景颜色半透明的两种方法及区别css实现背景颜色半透明的两种方法及区别
-
追格小站点评主题“H5资讯列表”标题调整为两行或多行的方法追格小站点评主题资讯列表的标题在H5模式下默认为一行,超出隐藏,我们可以通过调整css,将WordPress主题小站点评资讯列表标题调整为两行显示。
暂无评论,抢个沙发...