变形属性 transform

Posted 2020-08-19 ypm_wbg

transform功能可以实现文字或图像的旋转、绽放、倾斜、与移动；

　　　　注意点：1、其移动、旋转、倾斜、与绽放这4种效果的使用先后顺序不同，页面会显示不同的结果；

　　　　　　　　2、属性值有一个参数与有多个参数的别；

　　　　　　　　3、在用移动效果时注意其移动方向（很容易在不看效果时，不知向那移动）；

tansform的属性值：

　　2D时：

　　1、translate(x,y)：有两个参数，第一个参数表示水平方向上移动，第二个参数表示垂直方向上移动，注意---当只写一个参数时表示只在水平方向上移动，垂直方向上不移动；　　　　                                       写法translate(50px,60px)或translate(1000px);

　　2、ratate(x)：参数表示度数，单位用度表示，写法为ratate(45deg);旋转方向 为顺时针旋转；

　　3、skew()