css3：元素总是围绕中心旋转[关闭]答案

【问题标题】：css3: element always rotates around center [closed]css3：元素总是围绕中心旋转[关闭]
【发布时间】：2013-05-21 04:52:50
【问题描述】：

我有这个demo。如图所示，元素围绕其中心旋转，但我正在尝试让它围绕其左边框（或左轴，或 y 轴？）旋转。这可能吗？

这是我的html

<div id="parent">
    <div class="item">Rotate</div>
</div>

还有CSS

#parent {
    -webkit-perspective: 850px ;
    margin-left: 200px ;
}
.item {    
    -webkit-transform-style: preserve-3d ;
    -webkit-transition: -webkit-transform 5s linear ;
    background-color: grey ;
    width: 200px ;
    -webkit-tranform-origin: top left 0 ;
}
.item.rotate {
    -webkit-transform: rotateY(180deg) ;
}

使用 javascript 我将类 rotate 添加到 div.item 中，这样它就会开始旋转。

【问题讨论】：

标签： css rotation css-transitions

【解决方案1】：

你有错别字

-webkit-tranform-origin: top left 0 ;

我改成

-webkit-transform-origin: top left 0;

我认为这就是你的意思（？）DEMO

【讨论】：