CSS3变形和过渡

169 阅读1分钟

transform:translate(100px,20px);【平移】

transform:scale(20px,20px);        【缩放】

(一个值是从中心点缩放)

(scale为0时,表示缩小到消失)

transform:skew(20deg,20deg);     【倾斜】

(第一个X按照逆时针旋转,第二个Y按照顺时针旋转)

 transform: rotate(30deg);                    【旋转】

(不设置X,Y只会沿着中心点旋转,不改变宽和高) 

(设置X沿着X旋转,会改变高度,设置Y沿着Y旋转,会改变宽度)

transition-property;           【过渡】 

transition-durationg;         【过渡所需的时间】

transition-timing-function;【过渡动画函数】

transition-delay;                 【过渡开始延迟时间】

语法:【transition:{transition-property  transition-durationg  transition-timing-function

            transition-delay}】