transition属性 (过渡)
属性值:
- 参与过渡的属性(默认的为all)
- 时间(过渡的时间 s ms)
- 延迟时间 s ms
- 运动的类型 linear(匀速)
注:transition必须通过事件触发,如 :hover
运动类型:贝塞尔曲线https://cubic-bezier.com/#.33,1.84,.47,-0.88
<style>
.box{
width: 500px;
height: 300px;
background: orange;
transition: background 1s 2s,width 3s;
}.box:hover{
background: blue;
width: 1000px;
}
</style>
本文深入讲解CSS中的transition属性,探讨如何设置参与过渡的属性、过渡时间和延迟时间,以及不同的运动类型,包括使用贝塞尔曲线进行高级动画效果的调整。通过:hover事件触发过渡,展示背景颜色变化和宽度增加的具体应用。
791

被折叠的 条评论
为什么被折叠?



