CSS3变换,倾斜和旋转

Question

我正在寻找CSS3变换,并希望有一个倾斜和旋转的盒子.

我尝试过使用:

transform:rotate(80deg);
-moz-transform:rotate(80deg); /* Firefox */
-webkit-transform:rotate(80deg); /* Safari and Chrome */
-o-transform:rotate(80deg); /* Opera */
-webkit-transform: skew(50deg);
-moz-transform:skew(50deg);
-o-transform:skew(50deg);
transform:skew(50deg);

这似乎只是扭曲了div.

你可以在同一个div上使用倾斜和旋转吗？

谢谢

Answer 1

您不应该多次声明变换(后面的规则总是获胜),而应该使用以下空格分隔变换:

transform: rotate(80deg) skew(20deg);

在此规则之前不要忘记所有供应商前缀.

您可以在W3C的工作草案中看到语法