html图片旋转3种方式—— CSS3 transform

html图片旋转有3中方式：ie 滤镜，CSS3 transform，HTML5 canvas rotate

参考文章：网页中图片旋转的几种实现方式

 CSS3 transform

css3 的transform属性允许我们旋转、缩放和移动元素。 可以通过给它传递一个 rotate(度数) 值来旋转一个元素，正值表示顺时针方向旋转，负值表示逆时针方向旋转，旋转的中心点为元素的中心。

浏览器支持：Firefox 4+、Oprea 10+、Safari 3.1+、Chrome 8+、IE 9+

CSS代码：

.rotate{
	-ms-transform:rotate(90deg); /* IE 9 */
	-moz-transform:rotate(90deg); /* Firefox */
	-webkit-transform:rotate(90deg); /* Safari and Chrome */
	-o-transform:rotate(90deg); /* Opera */
}　　

JS代码：

element.style.webkitTransform="rotate(-90deg)"
element.style.MozTransform="rotate(-90deg)"
element.style.msTransform="rotate(-90deg)"
element.style.OTransform="rotate(-90deg)"
element.style.transform="rotate(-90deg)";

css3 tranform rotate 旋转演示：