Image 如何使用CSS使图像翻转旋转

我正在尝试使用CSS3使图像翻转

---

下面是一个使用JS的示例，但我需要一个简单的CSS解决方案

您可以试试这个：

img{
    -webkit-transition: all 1s; /* For Safari 3.1 to 6.0 */
            transition: all 1s;
}
img:hover{
    -webkit-transform: rotate(270deg); /* Chrome, Safari, Opera */
        -ms-transform: rotate(270deg); /* IE 9 */
            transform: rotate(270deg);
}

---

根据我的理解，您编辑了您的问题，那么这就是最佳解决方案：

img{
    -webkit-transition: all 1s; /* For Safari 3.1 to 6.0 */
            transition: all 1s;
}
img:hover{
    -webkit-transform: rotate(270deg); /* Chrome, Safari, Opera */
        -ms-transform: rotate(270deg); /* IE 9 */
            transform: rotate(270deg);
}

例如：

---

更完整的供应商前缀版本：

-webkit-transition: -webkit-transform 1s;
-moz-transition:    -moz-transform 1s;
-o-transition:      -o-transform 1s;
-ms-transition:     -ms-transform 1s;
transition:         transform 1s;

可能重复的