css3过渡transition笔记_html

transition属性值:

1.transition-property——规定应用过渡的 CSS 属性的名称。 2.transition-duration——定义过渡效果花费的时间。默认是 0。 3.transition-timing-function——规定过渡效果的时间曲线。默认是 "ease"。 4.transition-delay——规定过渡效果何时开始。默认是 0。

transition触发方式:

1.伪类触发——hover|active|focus 2.媒体查询触发——@media 3.js触发——click|hover等

transition兼容写法:

div{
transition: width 1s linear 2s;
/* Firefox 4 */
-moz-transition:width 1s linear 2s;
/* Safari and Chrome */
-webkit-transition:width 1s linear 2s;
/* Opera */
-o-transition:width 1s linear 2s;
}

div{
transition: width 2s, height 2s, transform 2s;
-moz-transition: width 2s, height 2s, -moz-transform 2s;
-webkit-transition: width 2s, height 2s, -webkit-transform 2s;
-o-transition: width 2s, height 2s,-o-transform 2s;
}