CSS3 transition属性
作用:设置元素的过渡属性
申明:复合属性。检索或设置对象变更时的过渡。用于设置四个过渡属性:transition-property,transition-duration,transition-timing-function,transition-delay。
语法:
transition: property duration timing-function delay;
transition-property:划定设置过渡结果的 CSS 属性的称号。
transition-duration:划定完成过渡结果须要若干秒或毫秒。
transition-timing-function:划定速率结果的速率曲线。
transition-delay:定义过渡结果什么时候最先。
CSS3 transition属性的运用示例
<!DOCTYPE html> <html> <head> <style> div { width:100px; height:100px; background:yellow; transition:width 2s; -moz-transition:width 2s; /* Firefox 4 */ -webkit-transition:width 2s; /* Safari and Chrome */ -o-transition:width 2s; /* Opera */ } div:hover { width:300px; } </style> </head> <body> <div></div> <p>请把鼠标指针放到黄色的 div 元素上,来检察过渡结果。</p> <p><b>解释:</b>本例在 Internet Explorer 中无效。</p> </body> </html>
结果图:
以上就是本篇文章的全部内容,愿望能对人人的进修有所协助。更多精彩内容人人能够关注ki4网相干教程栏目!!!
以上就是transition属性怎样用的细致内容,更多请关注ki4网别的相干文章!