transition的用法

Posted 2020-09-23 sameer的史迪仔

http://www.cnblogs.com/xiaohuochai/p/5347930.html

 

transiton: 过渡属性 过渡所需要时间 过渡动画函数 过渡延迟时间；

触发过渡

单纯的代码不会触发任何过渡操作，需要通过用户的行为（如点击，悬浮等）触发，可触发的方式有： 
:hoever :focus :checked 媒体查询触发 javascript触发

局限性

transition的优点在于简单易用，但是它有几个很大的局限。 
（1）transition需要事件触发，所以没法在网页加载时自动发生。 
（2）transition是一次性的，不能重复发生，除非一再触发。 
（3）transition只能定义开始状态和结束状态，不能定义中间状态，也就是说只有两个状态。 
（4）一条transition规则，只能定义一个属性的变化，不能涉及多个属性。 
CSS Animation就是为了解决这些问题而提出的。

 

animation属性类似于transition，他们都是随着时间改变元素的属性值，其主要区别在于：transition需

要触发一个事件才会随着时间改变其CSS属性；animation在不需要触发任何事件的情况下，也可以显式的随

时间变化来改变元素CSS属性，达到一种动画的效果

http://blog.csdn.net/XIAOZHUXMEN/article/details/52003135