CSS3过渡是元素从一种样式逐渐改变为另一种的效果
要实现这一点,必须规定希望把效果添加到哪个 CSS 属性上和规定效果的时长。
属性:
transition;
transition-property;
transition-duration;
transition-timing-function;
transition-delay;
ex:
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;
}