栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > Html/CSS > CSS教程

2018-04-29 关于CSS3-2D,3D转换

CSS教程 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

2018-04-29 关于CSS3-2D,3D转换

一: 2D:

x

      -

    -

    -

    -

-----------------------------------------------------         y

transform:

变换方法:  translate() 定义移动的位置。

值 :       rotate()      顺时针旋转。负数时逆时针旋转

       scale()

       skew()

       matrix()

translate(x,y) 该方法根据左(x)轴和顶部(y)轴给定的参数,从当前位置移动

示例: transform: translate(100px,100px);

rotate(deg) 顺时针旋转

示例: transform:rotate(30deg); 顺时针旋转30度

scale() 该方法增加或减少的大小,取决于宽度X轴和高度Y轴的参数

示例: transform:scale(1,2)      元素转变宽度为原来大小的1倍,原始大小的2倍。

skew(Xdeg,Ydeg)    斜拉    尽量少用(暂时不理解)

skewX(deg) 表示只在X轴( 水平方向 )  旋转  !   注意:是水平方向,当旋转到90度时消失

skewY(deg) 表示只在Y轴( 垂直方向 )  旋转  !   注意:是垂直方向,当旋转到90度时消失

matrix(6个属性)

transform: matrix(与我无关, 哪位, 怎么不去高考, 打麻将去吧, 水平偏移距离, 垂直偏移距离);

你只要关心后面两个参数就可以了,至于前面4个参数,是牛是马,是男是女都没有关系的。

             




作者:啾咪啾咪啾
链接:https://www.jianshu.com/p/0765dac63c74


转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/242918.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号