CSS 3D多维数据集-webkit转换

我能够使用在线示例在css中重现旋转的3D立方体。现在我正在分析代码，以便了解代码的含义并了解其工作原理。 但是有一件事我不明白，我知道“transition”属性允许我在从一种样式更改为另一种样式时添加效果。（例如更改元素的宽度）但在可以找到的代码中，它的使用方式我不理解

-webkit-transition: -webkit-transform 2s linear;

如果我不使用这段代码，多维数据集的外观和行为完全相同，我不明白它的作用以及是否有必要

---

谢谢你的帮助

-webkit-

是webkit浏览器上用于属性的前缀，这些属性不一定具有完全支持，并且处于测试/实验阶段。CSS世界中还有一些其他前缀。一些比较流行的是：

-moz-

（Firefox）、

-o-

（Opera）和

-ms-

（Internet Explorer）

此处

-webkit transition:

是以webkit为前缀的

transition

属性，

-webkit transform

是以webkit为前缀的

transform

属性

如果我们看看我能用。。。对于浏览器支持，我们将看到在某些移动浏览器上需要

-webkit-

前缀。我们还将看到，这需要

-webkit-

前缀才能在相当多的webkit浏览器上工作

例如，为了在Android浏览器上为我们的

transform

属性提供

transition

，我们需要使用：

-webkit转换：-webkit转换2s线性；

在完全支持

transform

和

transition

的浏览器上，我们可以通过以下方式实现相同的效果：

转换：转换2s线性；

为了安全起见，我们还可以为需要在

transform

属性上使用WebKit前缀的浏览器提供服务，但是可能已经删除了

transition

属性上的前缀-尽管这可能是不必要的：

transition: -webkit-transform 2s linear;

---

我不明白的是“线性变换”给立方体增加了什么

这将向指定给立方体的变换特性添加两秒钟的线性变换（动画）。如果没有此选项，转换属性将立即更改，但使用此选项，更改将在两秒钟内逐渐进行

下面是我在操作中突然创建的

转换

属性。在这里，我们的第一个图形在悬停时立即从红色变为绿色，但我们的第二个图形需要2秒钟才能改变

---

链接到的代码中的转换似乎对对象没有任何影响。

我知道css供应商前缀的意思，这不是我不理解的部分。我不明白的是“transform 2s linear”给立方体添加了什么，因为如果我删除那行代码，立方体看起来完全一样。抱歉，如果我的帖子误导了你，无论如何，谢谢你的回答。@user3051847啊，我明白了。我在回答的末尾加了一点。再次感谢你的回答：-）。多亏了您的JSFIDLE演示，我理解了转换的作用。但正如你所说，我的代码中的转换没有任何作用，所以我认为代码中不需要这一行，而演示的创建者犯了一个错误？