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属性为必须

div{
    width:100px;height:100px;
    background:#abcdef;
    opacity:0;
    transition:opacity 5s ease-in-out;
}
div:hover{
    opacity:1;
    transition:opacity 5s ease-in-out;
}