css过渡2D变幻.docx

《css过渡2D变幻.docx》由会员分享，可在线阅读，更多相关《css过渡2D变幻.docx（25页珍藏版）》请在冰豆网上搜索。

css过渡2D变幻

1背景颜色过度

DOCTYPEhtml>

--

描述：

复合属性。

检索或设置对象变换时的过渡。

可以为同一元素的多个属性定义过渡效果。

语法：

transition：

[transition-property]||[transition-duration]||[transition-timing-function]||[transition-delay]

默认值：

看每个独立属性

取值：

[transition-property]：

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

[transition-duration]：

检索或设置对象过渡的持续时间

[transition-timing-function]：

检索或设置对象中过渡的动画类型

[transition-delay]：

检索或设置对象延迟过渡的时间

-->

请将鼠标移动到下面的矩形上：

2延迟时间

DOCTYPEhtml>

--

描述：

检索或设置对象延迟过渡的时间。

如果提供多个属性值，以逗号进行分隔。

语法：

transition-delay：

[,]*

默认值：

0

取值：

：

指定对象过渡的延迟时间

-->

请将鼠标移动到下面的矩形上：

3对象过度时间

DOCTYPEhtml>

--

描述：

检索或设置对象过渡的持续时间。

如果提供多个属性值，以逗号进行分隔。

语法：

transition-duration：

[,]*

默认值：

0

取值：

：

指定对象过渡的持续时间

-->

请将鼠标移动到下面的矩形上：

矩形在0.5s内慢慢向右移动
transition-duration:

.5s;