transform兼容ie8

时间：2025-03-29 19:46:52
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>IE浏览器CSS transform旋转属性的演示</title>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
<style type="text/css">
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:(sizingMethod='auto expand', M11=0.7660444431189777, M12=-0.6427876096865394, M21=0.6427876096865398, M22=0.7660444431189779)}
</style>
<!--[if IE]>
<style type="text/css">
#example {
 top: 50px;
 left: 50px;
}
</style>
<![endif]-->
</head>
<body>
<div ></div>
<div >这是一个CSS旋转属性的演示</div>
</body>
</html>

相关文章