CSS3中的 transform (变形) Transition(转换) animation(动画)属性

 transform (变形)

包括:旋转rotate、扭曲skew、缩放scale和移动translate以及矩阵变形matrix

transition主要包含四个属性值:

transform: rotate | scale | skew | translate |matrix;

transform:rotate(45deg);围绕中心旋转角度

transform-origin:left top 修改旋转中心(默认就是中心点) {left top right bottom}

transform:translate(x,y) 位移距离 translateX(x)  translateY(y){三种位移方式}

transform:scale(x,y) 缩放大小 以图形中心点缩放,通过transform-origin设置以某点缩放  transform:scaleX(x) 水平方向缩放 transform:scaleY(y) 垂直方向缩放

transform:skew(10deg,10deg)  一中心点为基点扭曲图像  transform:skewX() 水平方向扭曲      transform:skewY() 垂直方向扭曲

   

 

 

transition主要包含四个属性值:

执行变换的属性:transition-property;

变换延续的时间:transition- duration;

在延续时间段,变换的速率变化transition-timing-function;

变换延迟时间transition- delay。

 

 

CSS3中的 transform (变形) Transition(转换) animation(动画)属性,古老的榕树,5-wow.com

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。