Loading [MathJax]/jax/input/TeX/config.js

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

社区首页 >问答首页 >请解释css rotate3d的工作原理。

问请解释css rotate3d的工作原理。
EN

Stack Overflow用户

提问于 2015-09-09 18:13:54

回答 1查看 130关注 0票数 2

我有一个应用了transform: rotate3d(1,1,1,90deg)的图像，其中每个参数分别表示X轴、Y轴和Z轴(根据CSS)。图像应该从倾斜显示的视图中消失。

让我们将其分解：rotate3d(1,0,0,90deg)将隐藏图像，因为如果您将图像在X轴上旋转90度，则图像将平放在X轴上。这部分起作用了。您可以在浏览器中测试它。让我们添加Y轴：rotate3d(1,1,0,90deg)，图像仍然没有显示，这是正确的。现在你在Y轴上旋转图像到什么程度并不重要-我们仍然看不到图像。当我添加第三个轴Z- rotate3d(1,1,1,90deg)时，图像显示倾斜。为什么？它应该将不可见的图像旋转90度，这将导致不可见的图像)

那么CSS rotate3d是如何工作的呢？有人知道吗？我还没有在网上找到答案。

EN

回答 1

Stack Overflow用户

发布于 2015-09-10 03:40:39

hoijui，你是对的，这些数字构成了从我的图像中心到三维坐标(1,1,1)的轴。但是图像不绕轴旋转--轴旋转图像！:)几乎就像伽利略的发现:)

所以，要理解rotate3d，只需拿一张正方形的纸，用牙签刺穿它，它就是你的轴。把纸和牙签放在眼睛前面(不要靠得太近，否则会刺破眼睛！)现在将牙签尖端(正对着你)倾斜到纸张的右下角(底部是因为在CSS rotate3d中Y是向下的)。Z取决于你的牙签有多长。如果牙签的长度与纸张的宽度相同，则坐标将为(1，1，1)，这是我在实验中使用的坐标。现在开始在你的手中滚动牙签。如果您尝试在firebug或开发人员工具中手动增加角度，您将在屏幕上看到完全相同的效果。

票数 1

EN

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/32486558

复制

相关文章

深入解释 CTGAN 的工作原理

机器学习神经网络深度学习人工智能编程算法

本文的目的是解释Conditional Tabular GANs的工作原理，因为目前我还没有看到类似这样的文章。表格数据生成是一个不断发展的研究领域。CTGANs 论文已成为许多其他机器学习架构的基础，这些架构如今构成了该研究领域的最新技术。

deephub

2021/11/16

1.3K0

CSS入门指南-1：css工作原理

每个html元素都有一组样式属性，可以通过css来设定。当html元素的同一个样式属性有多种样式值的时候，css就要靠层叠机智来决定最终应用哪种样式。

goodspeed

2020/12/22

8870

CSS入门指南-1：css工作原理

解释 JavaScript 中计时器的工作原理

编程算法 javascript

在 JavaScript 中，计时器是一个非常值得注意的功能。与普通的手表计时器一样，我们可以一次启动计时器，并在特定时间后执行 JavaScript 中的函数或代码。

很酷的站长

2023/01/08

1.5K0

解释 JavaScript 中计时器的工作原理

卷积神经网络工作原理直观的解释

卷积神经网络深度学习神经网络

先坦白地说，有一段时间我无法真正理解深度学习。我查看相关研究论文和文章，感觉深度学习异常复杂。我尝试去理解神经网络及其变体，但依然感到困难。接着有一天，我决定一步一步，从基础开始。我把技术操作的步骤分解开来，并手动执行这些步骤（和计算），直到我理解它们如何工作。这相当费时，且令人紧张，但是结果非凡。现在，我不仅对深度学习有了全面的理解，还在此基础上有了好想法，因为我的基础很扎实。随意地应用神经网络是一回事，理解它是什么以及背后的发生机制是另外一回事。今天，我将与你共享我的心得，展示我如何上手卷积神经网

朱晓霞

2018/07/20

7380

解释一下 HashMap 的工作原理

hashmap 数据结构存储编程算法 java

HashMap 是基于散列表的数据结构。所谓散列表，它通过键值对的方式存储数据，把 key 通过散列算法计算出一个存储地址，将 value 放入这个地址中。散列表是最常用的数据结构之一，在不考虑 hash 冲突的情况下，散列表的查询复杂度是 O(1)。

水货程序员

2018/11/13

1.1K0

卷积神经网络工作原理直观的解释？

卷积神经网络

CNN（卷积神经网络）形象地来说像一个黑匣子，只能看到输入和输出的数据，不太清楚其匣子内部到底怎么运转的：如何从初始状态一步步走向结果。不同层数的卷积处理出来的结果，它们形成的特征有什么不同呢？每一层卷积后形成的侦查特征，又和后面的侦查特征有什么关系呢？到底选择几个卷积核来完成我的意图？各层卷积处理结果组合而成会达到什么效果呢？这个过程到底“看起来”什么样的呢？今天从直观的角度来把这个黑匣子剖开，加深我们对CNN工作的直观印象。其实我们在做线性回归也好，分类（逻辑斯蒂回归）也好，本质上来讲，就

用户1332428

2018/03/08

9150

卷积神经网络工作原理直观的解释？

卷积神经网络工作原理直观的解释？

其实我们在做线性回归也好，分类（逻辑斯蒂回归）也好，本质上来讲，就是把数据进行映射，要么映射到一个多个离散的标签上，或者是连续的空间里面，一般简单的数据而言，我们很好拟合，只要线性变化一下，然后学习出最好的 W 就可以了。但是对于一些比较复杂的数据怎么办呢？比如说，对于一个二分类问题，特别是高纬度复杂化之后，数据不一定是线性可分的，这个时候，我们的 basis function 隆重登场，我们可以把数据进行一定的映射，转变，非线性的线性的，转变之后，就可以进行分类。最明显的例子在 andrew NG 在讲

AI研习社

2018/03/19

5540

卷积神经网络工作原理直观的解释？

CSS粘性定位 - 它的真正工作原理！

css 容器工作浏览器原理

CSS中的sticky定位有很好的浏览器支持，但许多开发者并没有使用它。原因有两方面：一是等待浏览器支持的时间太长，导致这个特性被遗忘；二是大部分开发者并不完全理解它的工作原理。

前端小智@大迁世界

2023/07/09

3870

CSS粘性定位 - 它的真正工作原理！

卷积神经网络工作原理直观解释

卷积神经网络线性回归

其实我们在做线性回归也好，分类（逻辑斯蒂回归）也好，本质上来讲，就是把数据进行映射，要么映射到一个多个离散的标签上，或者是连续的空间里面，一般简单的数据而言，我们很好拟合，只要线性变化一下，然后学习出最好的W就可以了，但是对于一些比较复杂的数据怎么办呢？比如说，对于一个二分类问题，特别是高纬度复杂化之后，数据不一定是线性可分的，这个时候，我们的basis function隆重登场，我们可以把数据进行一定的映射，转变，非线性的线性的，转变之后，就可以进行分类，最明显的例子在andrew NG在讲SVM里面的例

智能算法

2018/04/03

6280

卷积神经网络工作原理直观解释

其实我们在做线性回归也好，分类（逻辑斯蒂回归）也好，本质上来讲，就是把数据进行映射，要么映射到一个多个离散的标签上，或者是连续的空间里面，一般简单的数据而言，我们很好拟合，只要线性变化一下，然后学习出最好的W就可以了，但是对于一些比较复杂的数据怎么办呢？比如说，对于一个二分类问题，特别是高纬度复杂化之后，数据不一定是线性可分的，这个时候，我们的basis function隆重登场，我们可以把数据进行一定的映射，转变，非线性的线性的，转变之后，就可以进行分类，最明显的例子在andrew NG在讲SVM里面的例子就很好的说明了，但是这个时候问题来了，对于一个很复杂，高维度的数据，我们如何才能找到最好的basis function呢？

智能算法

2018/10/23

5290

卷积神经网络工作原理直观解释

卷积神经网络

其实我们在做线性回归也好，分类（逻辑斯蒂回归）也好，本质上来讲，就是把数据进行映射，要么映射到一个多个离散的标签上，或者是连续的空间里面，一般简单的数据而言，我们很好拟合，只要线性变化一下，然后学习出最好的W就可以了，但是对于一些比较复杂的数据怎么办呢？比如说，对于一个二分类问题，特别是高纬度复杂化之后，数据不一定是线性可分的，这个时候，我们的basis function隆重登场，我们可以把数据进行一定的映射，转变，非线性的线性的，转变之后，就可以进行分类，最明显的例子在andrew NG在讲SVM里面的例

智能算法

2018/04/02

6170

模型|“请解释”黑盒机器学习模型的解释性

机器学习神经网络深度学习人工智能 https

2019年2月，波兰政府对银行法进行了修订，赋予客户在做出信贷拒绝时获得解释的权利。这是在欧盟实施GDPR的直接后果之一。这意味着，如果决策过程是自动的，银行需要能够解释为什么不发放贷款。

陆勤_数据人网

2019/05/14

1.3K0

Diffusion 和Stable Diffusion的数学和工作原理详细解释

扩散模型的兴起可以被视为人工智能生成艺术领域最近取得突破的主要因素。而稳定扩散模型的发展使得我们可以通过一个文本提示轻松地创建美妙的艺术插图。所以在本文中，我将解释它们是如何工作的。

deephub

2023/02/01

2.8K0

Webkit底层原理(5)--CSS解释器和样式布局

html css javascript

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

从入门到进错门

2019/10/22

1.1K0

Webkit底层原理(5)--CSS解释器和样式布局

servlet的工作原理_hibernate工作原理

https 网络安全

版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请发送邮件至举报，一经查实，本站将立刻删除。

全栈程序员站长

2022/11/09

1.4K0

servlet的工作原理_hibernate工作原理

用途 rotate3d 规定3D 旋转。语法 rotate3d(x,y,z,angle) 值值描述 x 规定围绕X轴旋转的矢量值。 y 规定围绕Y轴旋转的矢量值。 z 规定围绕Z轴旋转的矢量值。 <angle> <angle>代表旋转的角度。一个正数的角度表示顺时针旋转，负数的角度表示逆时针旋转。例子 /* HTML */ <div class="stage"> <div class="box"></div> </div> /* CSS */ .stage{ width:100

Html5知典

2019/11/26

3980

【CSS3】CSS3 3D 转换 ④ ( 3D 旋转 rotate3d | rotate3d 语法 | rotate3d 自定义轴旋转 | 元素旋转方向 - 左手准则 | 代码示例 )

容器 css3 动画函数语法

3D 旋转指的是在三维空间坐标系中 , 绕 X 轴 , Y 轴 , Z 轴进行旋转 , 同时还可以绕自定义轴进行旋转 ;

韩曙亮

2023/10/15

2.6K0

【CSS3】CSS3 3D 转换 ④ ( 3D 旋转 rotate3d | rotate3d 语法 | rotate3d 自定义轴旋转 | 元素旋转方向 - 左手准则 | 代码示例 )

整流电路工作原理解释（半波、全波）

整流电路将交流电 (AC) 转换为直流电 (DC)。一般采用两个整流器进行整流，即半波整流器和全波整流器。

IDC科技

2022/12/30

3.1K0

整流电路工作原理解释（半波、全波）

请解释一下TreeMap?

TreeMap是一个有序的key-value集合，基于红黑树（Red-Black tree）的 NavigableMap实现。该映射根据其键的自然顺序进行排序，或者根据创建映射时提供的 Comparator进行排序，具体取决于使用的构造方法。

剑走天涯

2019/09/10

4680

点击加载更多

相似问题

如何使我的图像响应，最大宽度不工作

23

图像对最大宽度属性没有响应。

20

图像的宽度和最大宽度属性

43

如何使IE支持最小宽度/最大宽度CSS属性？

35

最大高度和最大宽度的响应图像

40

添加站长进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例