CSS3之过渡Transition
CSS3也有着非常强大的属性,那就是过渡——Transition。过渡——Transition在W3C的描述:“css的transition允许css的属性值在一定的时间区间内平滑地过渡。这种效果可以在鼠标单击、获得焦点、被点击或对元素任何改变中触发,并圆滑地以动画效果改变CSS的属性值。”既然CSS3的过渡这么强大,下面我们就一点一点掌握它吧。
CSS3中的过渡Transition有四个中心属性:transition-property、transition-duration、transition-delay和transition-timing-function。
一、transition-property——指定要运动的样式
1、transition-property的语法
<div id="timings-demo"><div id="ease" class="box">Ease</div><div id="ease-in" class="box">Ease-in</div><div id="ease-out" class="box">Ease-out</div><div id="ease-in-out" class="box">Ease-in-out</div><div id="linear" class="box">Linear</div><div id="cubic-bezier" class="box">Cubic-bezier</div></div>
预览地址:http://www.leemagnum.com/gdsl.html
CSS3之过渡Transition就为大家介绍到这里了,CSS3之过渡Transition的神奇之处远不止上面这些,还可以做很多好玩的小东东。在今后,想必CSS3之过渡Transition的应用会很广泛,掌握CSS3之过渡Transition可谓是当务之急呀。更多关于CSS3的东东还望关注本blog有关CSS3的更新哟。感谢大家长期以来对本blog的支持与厚爱。