[HtmlCssJs] 2025-01-17 圈点244
摘要:transition 属性可设置四个过渡属性:即:transition:transition-property transition-duration transition-timing-function transition-delay;transition兼容性代码;-webkit-transition:color 0.2s; /* Chrome */-moz-transition:color 0.2s; /* Firefox */-ms-transition:color 0.2s;
transition 属性可设置四个过渡属性:
即:transition:transition-property transition-duration transition-timing-function transition-delay;
transition-property:设置哪些内容需要过渡效果;
transition-duration:完成效果过程需要的时间;
transition-timing-function:效果的速度曲线;
transition-delay:过度效果从何时开始;
transition兼容性代码;
-webkit-transition:color 0.2s; /* Chrome */
-moz-transition:color 0.2s; /* Firefox */
-ms-transition:color 0.2s; /* IE */
-o-transition:color 0.2s; /* Opera */
transparent:color 0.2s;
transition示例:
a{
color:#f00;
-webkit-transition:color 0.2s; /* Chrome */
-moz-transition:color 0.2s; /* Firefox */
-ms-transition:color 0.2s; /* IE */
-o-transition:color 0.2s; /* Opera */
transparent:color 0.2s;
}
a:hover{
color:#0f0;
}
说明:上面的效果将从红色在0.2秒的时间内变成绿色;
<