transform的功能
</head>
<style>
div{
width:300px;
margin:150px auto;
background-color:#09F;
text-align:center;
transform:rotate(45deg);//旋转45度
}
</style>
<body>
<div>文字</div>
</body>
</html>
</head>
<style>
div{
width:300px;
margin:150px auto;
background-color:#09F;
text-align:center;
transform:scale(1.5);//缩放
}
</style>
<body>
<div>文字</div>
</body>
</html>
倾斜的效果
</head>
<style>
div{
width:300px;
margin:150px auto;
background-color:#09F;
text-align:center;
transform:skew(30deg,30deg);//倾斜
}
</style>
<body>
<div>文字</div>
</body>
</html>
移动
</head>
<style>
div{
width:300px;
margin:150px auto;
background-color:#09F;
text-align:center;
transform-origin:top left;//基准点
transform:translate(250px,50px)//移动
}
</style>
<body>
<div>文字</div>
</body>
</html>