一、什么是2D转换
在二维空间下对元素进行移动、缩放、转动、拉长或拉伸。
二、rotate() 方法(旋转)
在一个给定度数,正值是顺时针旋转
元素,负值是逆时针旋转
元素。
语法:
rotate(a)
选项参数:
a:是一种<angle>,表示旋转的角度。正角度表示了顺时针的旋转,负角度表示逆时针的旋转。
例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>rotate 方法演示</title>
<style>
div
{
width:200px;
height:100px;
text-align:center;
line-height:100px;
background-color:red;
color:white;
border:1px solid gray;
margin-top:10px;
}
div.rotate
{
transform:rotate(180deg); //顺时针旋转180度
}
</style>
</head>
<body>
<div>hellow world!</div>
<div class="rotate">hellow world!</div>
</body>
</html>
运行结果: