旋转图像

我想通过相隔90度的四个方向在网页上旋转图像。 我更喜欢这种情况发生在客户端机器上。 这可以用css完成吗？ 或者我需要使用javascript，我需要旋转背景图像，在页面上重复一个模式

感谢您的时间。

Answer 1

@tada; petah说你可以使用css3 rotate属性

div{ -moz-transform:rotate(90deg); -webkit-transform:rotate(90deg); -o-transform:rotate(90deg); -ms-transform:rotate(90deg); } 

＆对于IE，您可以使用IEfilter：

 filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); 

更多信息请查看以下链接：

http://snook.ca/archives/html_and_css/css-text-rotation

http://css-tricks.com/snippets/css/text-rotation/

Answer 2

CSS3有效，但我担心的是遗留兼容性。 根据这个矩阵 ，它不适用于IE 9之前的版本。

ImageMagick是一个显而易见的解决方案，但这是服务器端，因此它确实无法解决您的挑战。

我认为我倾向于Jquery Rotate ，这是一个非常好的插件，它肯定在纯粹的CSS解决方案上保持表示层的简单优势。 在兼容性的基础上，它现在远远超过纯CSS3。 Thanks, Microsoft.

Answer 3

你可以使用CSS3

查看http://davidwalsh.name/css-transform-rotate

 -moz-transform:rotate(120deg); -webkit-transform:rotate(120deg); -o-transform:rotate(120deg); -ms-transform:rotate(120deg); transform:rotate(120deg);