Perspective  透视点，视角，CSS3D 的透视点在浏览器前方

默认值为none，是作用于子元素，指定观察者与z=0平面的距离，使具有三维位置变换的元素产生透视效果。z>0的三维元素比正常大，而z<0时则比正常小，大小程度由该属性的值决定。
三维元素在观察者后面的部分不会绘制出来，即z轴坐标值（translateZ）大于perspective属性值的部分。
当Perspective  值不为0和none时，会创建新的层叠上下文。
 
默认情况下，消失点位于元素的中心，但是可以通过设置perspective-origin属性来改变其位置。perspective-origin可以决定你看的角度，默认为50% 50%
 
transform-style  应用于一个元素时，决定他的子元素们是在三维空间里，还是在平面空间变换位置

默认值为flat，3d为preserve-3d

 
backface-visibility 用来声明元素背面朝向我们时是否可见，元素的背面总是透明的，当其朝向观察者时，显示正面的镜像。
 
 

css 3d的更多相关文章

  1. Intro to CSS 3D transforms

    原文地址:Intro to CSS 3D transforms,本文只是翻译了其中的一部分,省去了作者写文章的原因浏览器兼容部分(已经过时) Perspective 元素需要设置需要设置perspec ...

  2. Codrops 优秀教程：CSS 3D Transforms 实现书本效果

    这个使用  CSS 3D Transforms 实现创意书本效果的来自 Codrops 网站.你可以看到两种类型的书设计:精装书和平装书.这两个效果都可以很容易地使用 CSS 修改.赶紧体验一下吧. ...

  3. 从css 3d说到空间坐标轴

    有一次我们说到掷骰子那个游戏,当时是用了一个steps属性+雪碧图来制作帧动画,这当然颇为不错,但其实一开始我想的不是这样的,我想的是用真的3d和动画去做,这个方案涉及到不少空间的知识,今天来给大伙好 ...

  4. 探究 CSS 混合模式\滤镜导致 CSS 3D 失效问题

    今天在写一个小的 CSS Demo,一个关于 3d 球的旋转动画,关于 CSS 3D,少不了会使用下面这几个属性: { transform-style: preserve-3d; perspectiv ...

  5. CSS 3D transforms

    https://www.creativebloq.com/css3/20-stunning-examples-css-3d-transforms-11112759 https://github.com ...

  6. EF Core使用SQL调用返回其他类型的查询 ASP.NET Core 2.0 使用NLog实现日志记录 CSS 3D transforms cSharp:use Activator.CreateInstance with an Interface? SqlHelper DBHelper C# Thread.Abort方法真的让线程停止了吗？ 注意！你的Thread.Abort方法真

    EF Core使用SQL调用返回其他类型的查询   假设你想要 SQL 本身编写,而不使用 LINQ. 需要运行 SQL 查询中返回实体对象之外的内容. 在 EF Core 中,执行该操作的另一种方法 ...

  7. 10个超漂亮的CSS 3D特效

    10个超漂亮的CSS 3D特效 一.总结 一句话总结: 后面有空得好好练一练,也可以作为录课素材 二.10个超漂亮的CSS 3D特效 转自或参考:10个超漂亮的CSS 3D特效https://blog ...

  8. css 3D动画

    一.今天让我们来学习一下css 3D吧! 1.首先我们要学习好css3 3d一定要有一定的立体感! 2.再来那就聊聊原理吧! 3.css3 3d 顾名思义是由两个2d名片组成的 但不是让你建立连个2d ...

  9. CSS 3D 的魅力

    作者 | 子慕大诗人 来源 | www.cnblogs.com/1wen/p/9064011.html   前言:   最近玩了玩用css来构建3D效果,写了几个demo,所以博客总结一下.  在阅读 ...

  10. WebVR & CSS 3D & WebGL

    WebVR & CSS 3D & WebGL VR https://developer.mozilla.org/en-US/docs/Web/API/WebVR_API https:/ ...

随机推荐

  1. javaWeb正则表达式

    对于web来说,字符串的处理特别重要,而正则表达式是对字符串处理的利器,在字符过滤,验证方面都能看到她的身影. 今天需要处理一段json字符串,在用String.replaceAll的过程中,遇到了正 ...

  2. 五年 Web 开发者 star 的 github 整理说明

    欢迎大家前往腾讯云技术社区,获取更多腾讯海量技术实践干货哦~ 作者:樊东东 前端从业几年,积累了不少github开源库. 有时候想查阅以前star的库,但不好找,github大多库都是英文说明,对中文 ...

  3. 程序编译没错，运行报错：无法定位程序输入点GT_BufLaserFollowRatio（这是函数）于动态链接库GTS.DLL上

    :DLL里面没有导出该函数    :DLL没放进DEBUGS文件夹 (当时的情况是这个)

  4. sql server作业实现数据同步

    作业介绍  SQL SERVER的作业是一系列由SQL SERVER代理按顺序执行的指定操作.作业可以执行一系列活动,包括运行Transact-SQL脚本.命令行应用程序.Microsoft Acti ...

  5. IDL 使用数组

    1.下标方式 IDL> array=indgen(8) IDL> print,array 0 1 2 3 4 5 6 7 IDL> print,array[3] IDL> ar ...

  6. DevOps教程

    唠叨话 关于德语关我屁事与靠计算逼哥数据,知识点的教学教程. 先简要搭建知识点框架:后逐步完善知识点内容.(暂时提供知识点,大部分未完善,持续更新中.) 注:第一版本,结束于2017年10月18日.其 ...

  7. Rythm.js 使用教程详解

    转载自 http://blog.csdn.net/qq_26536483/article/details/78261515 简介 rythm.js是一款让页面元素跳动起来的插件,并且带音乐,共7种用法 ...

  8. CSS滤镜效果

    使用 filter: blur() 生成毛玻璃效果 使用 filter: drop-shadow() 生成整体阴影效果 使用 filter: opacity() 生成透明度 blur生成阴影 通常我们 ...

  9. 学web前端开发写给新手的建议，超实用！

    01 前面的话 如今我们使用的互联网,客户端与服务器端的交互无时无刻不在发生.比如我们在浏览器打开网页,浏览器就是客户端,将网页数据发过来的也就是服务器.其实服务器,并没有什么特别的,也就是一台昼夜不 ...

  10. java zip解压

    /** * 解压文件到指定目录 * @param zipFile * @param descDir * @author sqdll */@SuppressWarnings("rawtypes ...