css3这两个语句对于transform是等价的吗？

我想知道这两组语句是否相等。我以为他们是，但他们似乎在做不同的事情

-webkit-transform: rotate(45deg); 
-webkit-transform: translateX(200px);
-webkit-transform-origin:0% 100%;

而且

-webkit-transform: rotate(45deg) translateX(200px); 
-webkit-transform-origin:0% 100%;

似乎在第一组语句中，只有translateX被执行，而rotate没有。我把第一组语句的顺序改为

-webkit-transform: translateX(200px);
-webkit-transform: rotate(45deg); 
-webkit-transform-origin:0% 100%;

它似乎只是执行旋转，而不是平移。它只做后一个吗？然而通过写作

-webkit-transform: rotate(45deg) translateX(200px); 
-webkit-transform-origin:0% 100%;

它先旋转，然后平移。我以为这只是写它的简写。不是吗

这里是代码的链接。这真的很简单。

---

谢谢你的帮助！非常感谢您提供清晰彻底的帮助=）

CSS的解析方式确保最后一条语句是唯一呈现的语句：

color: red;
color: green;
color: blue; /* This is what the color will be */

当您这样编写代码时：

-webkit-transform: rotate(45deg); 
-webkit-transform: translateX(200px);

-webkit transform

设置为

旋转（45度）

，然后用

translateX（200px）

覆盖

这是正确的语法：

-webkit-transform: rotate(45deg) translateX(200px); 

---

哦，我明白了。谢谢这是有道理的。我知道颜色会被覆盖，但我最初认为转换是附加的，而不是覆盖的