使用 CSS filter 实现 CSS3 的 transform 一样效果
顺时针转一下 顺时针转一下 逆时针转一下 这个没有转
HTML:
<span class="as-rotate as-rotate-90">顺时针转一下</span>
<span class="as-rotate as-rotate-90cw">顺时针转一下</span>
<span class="as-rotate as-rotate-90ccw">逆时针转一下</span>
CSS:
/* 顺时针 */
.as-rotate-90cw, .as-rotate-90{
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
transform: rotate(90deg);
}
/* 逆时针 */
.as-rotate-90ccw{
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-o-transform: rotae(-90deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
transform: rotate(-90deg);
}
注意: rotate 所占空间与未 rotate 前一样