css transform-origin属性怎么用

PHP中文网 JavaScript

本文摘自PHP中文网，作者silencement，侵删。

定义和用法

transform-origin 属性允许您改变被转换元素的位置。

2D 转换元素能够改变元素 x 和 y 轴。3D 转换元素还能改变其 Z 轴。

注释：该属性必须与 transform 属性一同使用。

实例

设置旋转元素的基点位置：

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

div

{

transform: rotate(45deg);

transform-origin:20% 40%;

 

-ms-transform: rotate(45deg);       /* IE 9 */

-ms-transform-origin:20% 40%;       /* IE 9 */

 

-webkit-transform: rotate(45deg);   /* Safari 和 Chrome */

-webkit-transform-origin:20% 40%;   /* Safari 和 Chrome */

 

-moz-transform: rotate(45deg);      /* Firefox */

-moz-transform-origin:20% 40%;      /* Firefox */

 

-o-transform: rotate(45deg);        /* Opera */

-o-transform-origin:20% 40%;        /* Opera */

}

语法

1

transform-origin: x-axis y-axis z-axis;

0c0d27ad78a85032cf2c13ecd691845.png

以上就是css transform-origin属性怎么用的详细内容，更多文章请关注木庄网络博客！

相关阅读 >>

css文本对齐属性的取值有几种

css代码是什么

div css怎么实现隐藏滚动条

如何使用css隐藏滚动条？

css modules 详解

css怎么隐藏下拉滚动条

css实现落叶动画效果

css外部样式表怎么写

css属性前缀有哪些

如何使用css设置文字透明背景不透明

更多相关阅读请进入《css》频道 >>




标签：

打赏

取消

感谢您的支持，我会继续努力的!

扫码支持
扫码打赏，您说多少就多少

打开支付宝扫一扫，即可进行扫码打赏哦

分享从这里开始，精彩与您同在

相关推荐

评论

管理员已关闭评论功能...