css3动画属性系列之transform细讲旋转rotate
1、语法:
transform: none | <transform-function> [<transform-function>]*
2、取值:
- none ----不进行变化
- <transform-function> ----一个或多个变换函数,以空格分开
可以用于内联元素和块级元素,可以实现旋转、缩放、移动等等效果。具体如下:
- rotate ---旋转
/* rotate(<angle>) 通过指定的角度对元素指定一个2D旋转 需要先有一个transform-origin属性的定义 transform-origin是旋转的基点 angle是旋转的角度,正值表示顺时针,负值表示逆时针 deg为度的意思,如60deg表示60度 */ #test{ transform:rotate(60deg); //w3c标准 -webkit-transform:rotate(60deg); //webkit内核的safari和chrome -moz-transform:rotate(60deg); //ff -o-transform:rotate(60deg); //opera -ms-transform:rotate(60deg); //IE9 }
相关推荐
冰蝶 2020-03-01
somboy 2020-02-29
zengni 2020-02-23
lanzhusiyu 2020-01-12
MaureenChen 2020-01-01
AlisaClass 2019-11-18
zengni 2019-10-27
懵懂听风雨 2015-11-12
沈宫新 2018-02-05
lanzhusiyu 2018-01-05
走向WEB开发 2017-09-18
走向WEB开发 2018-02-18
yaodilu 2019-06-30
qiupu 2019-06-29
sunshineboyleng 2020-07-08
impress 2020-05-11
yaodilu 2020-04-30