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如何实现圆形头像

css page-break-inside属性怎么用

css文本怎么设置水平对齐

bootstrap和css区别

css文件开头怎么写

css 如何设置带有正方形项目的列表

css怎么设置text不可编辑

如何修改织梦css

你值得了解的一种css获取图片主题色的小技巧（分享）

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




标签：

打赏

取消

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

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

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

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

相关推荐

评论

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