过渡
transition
过渡是由一种状态渐渐过渡到另一种状态,从而实现动画效果
div { width: 200px; height: 100px; margin: 100px auto; border: 1px solid black; background-color: lime; transition: width 1s;/*鼠标移入div后宽度变为400,持续时间1s*/ } div:hover{ width: 400px; }
语法详解(分解):
过度的属性 transition-property:
持续时间 transition-duration:
过渡延迟 transition-delay:
过渡运动方式 transition-timing-function:linear:linear匀速/ease-in-out先加速后减速
浙公网安备 33010602011771号