使用 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 前一样