CSS3有transition俄删、transform這些屬性忆某,它們是用來移動元素過渡元素之類的点待。
transform是什么?
它使元素變形褒繁,改變亦鳞,轉(zhuǎn)換
它有哪些常用屬性?
1.rotate
元素的旋轉(zhuǎn) 單位:deg(度)
例子:.a{transform:rotate(10deg)}
2.scale
元素的傾斜 單位:deg(度)
例子:.a{trasform:skew(20deg)}
3.scale
元素按比例縮放 縮小為負數(shù)
例子:.a{transform:scale(1.5)}.b{transform:scale(-3)}
4.translate
元素的位移 單位px
例子:.a{transform:translate(120px,10px)}
5.origin
改變元素的中心點
例子:.a{transform-origin:20% 50%}
transition屬性
以動畫效果使元素平滑過渡
1.transition-property
設(shè)置 要過渡的屬性 all是全部
例子:.a{transition-property:with}
2.transition-duration
指定元素轉(zhuǎn)換過程的持續(xù)時間棒坏,默認是0
例子:.a{transition-durantion:5s}
3.transition-timing-function
指定元素的動畫曲線
例子:.a{transition-timing-function:ease | linear | ease-in | ease-out | ease-in-out }
4.transition-delay
指定動畫延時時間
例子:.a{transition-delay:0.5s}