html设置旋转中心兼容ie,CSS3 transform旋转属性在IE中的实现

IE浏览器CSS transform旋转属性的演示

body {

font-family: "Arial", sans-serif;

}

#ptOfRef {

border: #000 solid 3px;

background: #6FF;

width: 204px;

height: 204px;

position: absolute;

top: 100px;

left: 100px;

}

#example {

position: absolute;

top: 100px;

left: 100px;

border: #09F solid 1px;

background: #F90;

font-weight: 900;

color: #FFF;

padding: 10px;

display: block;

width: 200px;

height: 200px;

margin-top: -1px;

margin-left: -1px;

transform: rotate(40deg);

-o-transform: rotate(40deg);

-webkit-transform: rotate(40deg);

-moz-transform: rotate(40deg);

filter: progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11=0.7660444431189777, M12=-0.6427876096865394, M21=0.6427876096865398, M22=0.7660444431189779)";

}

这是一个CSS旋转属性的演示

返回文章