这篇文章主要介绍了css中perspective属性和perspective()函数有什么异同点的相关知识，内容详细易懂，操作简单快捷，具有一定借鉴价值，相信大家阅读完这篇css中perspective属性和perspective()函数有什么异同点文章都会有所收获，下面我们一起来看看吧。透视属性perspective用于激活元素上的三维空间，以便其子元素可以定位在该空间中。它允许您通过使 z 轴上较高的元素（靠近观察者）显得更大，而远离的元素显得更小，从而为场景添加深度感。此图像中的蓝色圆圈表示三维空间中的一个元素。 字母 d 表示透视值，即观察者眼睛与屏幕之间的假定距离。 字母 Z 表示元素在 z 轴上的位置。 元素在 z 轴上越远，相对于观察者的外观越小，越近，看起来越大。 这就是立体空间中透视的效果。在不指定透视的情况下，使用三维变换函数变换的元素将看起来是平面和二维的。透视属性perspective与 CSS 变换 transforms 结合使用。 它需要一个长度值或关 香港云主机键字 none。 将此属性与 none 以外的任何值一起使用可建立堆叠上下文。 它还建立了一个包含块（有点类似于 position:relative），就像 transform 属性所做的那样。下图显示了在指定和不指定透视的情况下在三维空间中变换（旋转）一个元素的结果。使用 rotateY() 函数将图像在 y 轴上旋转 50 度。 左边的图像显示了在指定透视的情况下应用旋转的结果，右边的图像显示了没有透视的相同变换。 在右边的图像中，变换看起来是平面和二维的，因为没有触发三维空间。默认情况下，3D 空间的消失点（vanishing point）位于中心。 （它可以使用透视原点属性 perspective-origin进行更改。）官方语法声明：初始值：none适用于：transformable elements动画： 可以，作为长度值（Values）没有应用透视，因此没有触发三维空间。指定观察者和 z=0 平面之间的假定距离。它用于计算透视矩阵，使之将透视变换应用于元素及其内容。如果设置为零，则不应用透视。不允许使用负值。有关可能值的列表，请参阅 perspective激活该空间，或者使用转换元素本身的透视函数perspective()。 那么这两种方式有什么区别呢？透视属性perspective和透视函数perspective()都用于通过使 z 轴上较高（靠近观察者）的元素显得更大，使远离的元素显得更小来赋予元素深度。值越小，z-pane离观察者越近，效果越令人印象深刻；值越高，元素离屏幕越远，效果越微妙。当您使用透视函数perspective()将透视应用于元素时（有关其工作原理的详细信息，请参阅变换属性条目 transform），您仅在该元素上激活了三维空间。 在对单个元素应用三维变换时，perspective()表示法很方便。但是当你在一个容器中有多个转换的元素时，如果每个元素都使用透视函数perspective()设置了一个透视图，元素不会按预期排列。这是因为它们每个都有自己的三维空间，因此也有自己的消失点。为了避免这种情况并允许元素对齐，它们应该共享相同的空间。通过使用父容器上的透视属性perspective，创建一个由其所有子元素共享的三维空间，这些子元素都将使用 3 维变换进行变换。下图显示了在容器上触发一个三维空间的结果，容器的孩子在该空间中旋转（左），以及使用透视函数perspective()在每个项目上触发一个三维空间的结果（右）：关于“css中perspective属性和perspective()函数有什么异同点”这篇文章的内容就介绍到这里，感谢各位的阅读！相信大家对“css中perspective属性和perspective()函数有什么异同点”知识都有一定的了解，大家如果还想学习更多知识，欢迎关注开发云行业资讯频道。
这篇文章主要介绍如何解决笔记本电脑没有声音的问题，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！笔记本没有声音怎么修复笔记本没声音，有哪些原因：1、笔记本电脑将音量或者播放器的音量调到了最低（静音）导致笔记本没声音；2、笔记本声卡被禁用或…
免责声明：本站发布的图片视频文字，以转载和分享为主，文章观点不代表本站立场，本站不承担相关法律责任；如果涉及侵权请联系邮箱：360163164@qq.com举报，并提供相关证据，经查实将立刻删除涉嫌侵权内容。
微信扫一扫 
