继续transform的3D用法:

  translate3d(x,y,z)定义3D转换

  transformX(x)只用x轴的值进行转换;

  transformY(y)只用y轴的值进行转换:

  transfornZ(z)只用z轴的值进行3d转换;

  scale缩放

  scale3d(x,y,z)定义3d的缩放

  scaleX(x)在x轴方向的缩放

  scaleY(y)在y轴方向进行缩放

  scaleZ(z)定义在z轴的方向进行缩放

  rotate旋转(deg角度)

  rotate3d(x,y,z,angle)定义3d的旋转

  rotateX(deg)定义x轴的旋转

  rotateY(deg) 定义y轴的旋转

  rotateZ(deg)定义Z轴的旋转

  matrix3d( n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n)定义3d的转换,使用16个4乘4的矩形的值来定位。

  transform-origin:作用和2d的一样,都是改变变形的起点 z轴是3d的特有表现

  transform-style:规定被嵌套的元素如何在3d环境下显示:

    flat表示不保留在子元素的3d空间

    preserve-3d表示保留子元素的3d空间

  perspective-origin:规定3D元素的底部位置;目前浏览器都不支持;

  backface-visibility:定义元素在不面对屏幕时是否可见;浏览器支持度不好。

关于transform的3D变形函数的更多相关文章

  1. 3D变形旋转

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  2. css3 3D变形 入门(一)

    css3 3D.html div.oembedall-githubrepos { border: 1px solid #DDD; list-style-type: none; margin: 0 0 ...

  3. [Swift通天遁地]九、拔剑吧-(15)搭建具有滑出、视差、3D变形等切换效果的引导页

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  4. 9.css3动画-2D/3D变形--trasform

    transform: None不转换. Translate(x,y)通过设置X轴的值进行移动. translateY(y)通过设置Y轴的值进行移动. Scale(x,y)定义2D缩放. ScaleX( ...

  5. CSS3——2D变形和3D变形

    2D变形(CSS3) transform transform是CSS3中具有颠覆性的特征之一,可以实现元素的位移.旋转.倾斜.缩放,甚至支持矩阵方式,配合过渡和即将学习的动画知识,可以取代大量之前只能 ...

  6. Html CSS transform matrix3d 3D转场特效

    Html CSS transform matrix3d 3D转场特效 透视矩阵 2n/(r-l) 0 (r+l)/(r-l) 0 0 2n/(t-b) (t+b)/(t-b) 0 0 0 (n+f)/ ...

  7. deep_learning_Function_ Matplotlib 3D 绘图函数 plot_surface 的 rstride 和 cstride 参数

    今晚开始接触 Matplotlib 的 3D 绘图函数 plot_surface,真的非常强大,图片质量可以达到出版级别,而且 3D 图像可以旋转 ,可以从不同角度来看某个 3D 立体图,但是我发现各 ...

  8. transform做2d和3d变形(css动画一)

    前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! 有段时间我是没理清transform.translate.transition和animation之间的关 ...

  9. css3中变形函数(同样是对元素来说的)和元素通过改变自身属性达到动画效果

    /*对元素进行改变(移动.变形.伸缩.扭曲)*/ .wrapper{ margin:100px 100px auto auto; width:300px; height:200px; border:2 ...

随机推荐

  1. python进行各类API的使用

    前言: 献上歌曲一首: 因为快要上学了,昨天晚上熬夜.然后今天早上起床 没有什么精神.吃完午饭后开始思考今天写什么好呢 然后逛着逛着逛到了一个API网站.感觉还不错就爬了 0x01: 环境:windo ...

  2. 常见dos命令总结

    常用的内部命令有MD.CD.RD.DIR.PATH.COPY.TYPE.EDIT.REN.DEL.CLS.VER.DATE.TIME.PROMPT. 常用的外部命令有DELTREE.FORMAT.DI ...

  3. Node.js爬取豆瓣数据

    一直自以为自己vue还可以,一直自以为webpack还可以,今天在慕课逛node的时候,才发现,自己还差的很远.众所周知,vue-cli基于webpack,而webpack基于node,对node不了 ...

  4. java泛型类的继承规则

    首先看一看java泛型类的使用: /** * 一个泛型方法:使程序更加安全 * 并且能被更多的使用 * @author 丁** * * @param <T> */ class Pair&l ...

  5. zabbix 网络模板自动发现端口时,过滤掉某些特定规则的端口,减少item的方法

    1.需求描述        默认情况下Zabbix 模板 中网络接口自动发现接口时,会产生很多item,有时候会有我们不需要的一些接口,这时候需要过滤掉他们.        比如我有一台运行kvm的服 ...

  6. MySQL中的内置系统函数

    一.字符串函数  1. CONCAT(S1,S2....SN): 把传入的参数连接成一个字符串  2. INSERT(str, x, y, insert): 将字符串 X位置开始,y个字符串长度替换为 ...

  7. makefile讲解

    仅供自己学习使用 一.Makefile介绍 Makefile 或 makefile: 告诉make维护一个大型程序, 该做什么.Makefile说明了组成程序的各模块间的相互 关系及更新模块时必须进行 ...

  8. c的文件流读取

    strtok(数组,分隔符); atof(数组)返回值为转换后的数字; fgets(数组指针,长度,文件句柄); 整整花了两天啊

  9. 【转载】什么是Windows USB设备路径,它是如何格式化的?

    http://blog.csdn.net/kingmax54212008/article/details/77837210 用于接口的复合USB设备路径格式 \?usb#vid_ vvvv&p ...

  10. iOS开发之emoji处理

    看似emoji处理应该和我们iOS开发有着很大的关系,实则不然,对于emoji的处理只要在服务器端做就可以了,我所说的处理是我们将表情提交到服务器,那么在服务器端需要做些什么处理呢? 服务器如果直接存 ...