下一条： 判断手机旋转代码 屏幕旋转的事件和样式 >
CSS旋转代码 Css翻转代码，兼容方案代码
发布-xiaoming | 浏览量-
CSS代码，高级浏览器使用transform，ie用滤镜实现。
/*水平翻转*/
.flipx {
-moz-transform:scaleX(-1);
-webkit-transform:scaleX(-1);
-o-transform:scaleX(-1);
transform:scaleX(-1);
filter:FlipH();
}
/*垂直翻转*/
.flipy {
-moz-transform:scaleY(-1);
-webkit-transform:scaleY(-1);
-o-transform:scaleY(-1);
transform:scaleY(-1);
filter:FlipV();
}
/*顺时针旋转90度*/
.rotate90 {
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
/*顺时针旋转180度*/
.rotate180 {
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
-moz-transform: rotate(180deg);
-o-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
/*顺时针旋转270度*/
.rotate270 {
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
-moz-transform: rotate(270deg);
-o-transform: rotate(270deg);
-webkit-transform: rotate(270deg);
transform: rotate(270deg);
}
原文地址：http://www.35ui.cn/post/20150416841.html
标签：CSS旋转Css翻转
或许你还对下面的文章感兴趣
