css3中 transform 多个属性值的使用方法

原创
2018/01/03 16:06
阅读数 7.3K

单个属性时,可以这样使用:

transform :rotate(45deg);

多个属性时,用空格隔开:

transform: rotate(45deg)  scale(2)  skew(10deg,5deg)  translate(50px,90px);

 

注意:

1 . 我这只是举例如何添加多个css3属性,并没有考虑兼容性,要查看css3的兼容性可以到

    can I use( https://caniuse.com/#search=transform)查看。

2 . 如果你使用的是手机端,就不要考虑兼容性了,尽情使用css3。

3 . pc上完全兼容的话是在IE10,其它情况建议自测,参考以下w3c的说明:

Internet Explorer 10、Firefox、Opera 支持 transform 属性。

Internet Explorer 9 支持替代的 -ms-transform 属性(仅适用于 2D 转换)。

Safari 和 Chrome 支持替代的 -webkit-transform 属性(3D 和 2D 转换)。

 

展开阅读全文
打赏
0
0 收藏
分享
加载中
更多评论
打赏
0 评论
0 收藏
0
分享
OSCHINA
登录后可查看更多优质内容
返回顶部
顶部