CSS3旋转变换

Question

给定以下 Fiddle，如何使红色矩形在垂直平面中直立？

http://jsfiddle.net/paulsidebottom/vEWEL/

我已经尝试改变标记的旋转变换，但它似乎围绕同一轴旋转。

    #marker
    {   
      -webkit-transform:rotateY(-50deg);

Answer 1

您需要在其父级上保留 3d 转换:

    .threeD
    {
         -webkit-transform-style: preserve-3d;
         -webkit-transform: rotateX(55deg);
         -webkit-transition: all .5s ease-in-out;
         position:relative;
    }