CSS3过渡——transition

　　让CSS属性值在一定时间内平滑过渡

transition属性值

1.property

　　检索/设置对象中参与过渡的属性

　　可设置none（不设置过渡）、all（该对象所有属性设置过渡，默认值）、property（具体设置过渡的属性名称）

　　为解决兼容性问题，需要在transition前加上-webkit-、-moz-、-o-等前缀

2.duration

　　设置过渡的时长

　　默认为0，可设置秒（s）或毫秒（ms）

3.timing-function

　　设置过渡的类型

　　常用值：linear（线性）、ease、ease-in（慢进快出）、ease-out（快进慢出）、ease-in-out（慢到快到慢，推荐使用）

　　更复杂的需要调用贝塞尔曲线（类似于CSS动画里的timing-function）

4.delay

　　设置过渡的延时（即过渡之前要停多久再开始过渡）

　　默认为0，可设置秒（s）或毫秒（ms）

5.transition简写

　　顺序为property | duration | timing-function | delay，且不可随意调换

　　其中duration属性为必须

 1 div{
 2     width:100px;height:100px;
 3     background:#abcdef;
 4     opacity:0;
 5     transition:opacity 5s ease-in-out;
 6 }
 7 div:hover{
 8     opacity:1;
 9     transition:opacity 5s ease-in-out;
10 }