CSS3的transform属性中，rotate()函数可以实现旋转元素的效果。具体来说，rotate()函数可以接收一个参数，用于指定旋转的角度，单位是deg（度数），可以是正数或负数。其中，正数表示顺时针方向旋转，负数表示逆时针方向旋转。
使用rotate()函数旋转元素的步骤如下：
- 在CSS样式中设置transform属性，并使用rotate()函数指定旋转角度。
- 如果需要元素旋转后保持原来的位置，可以使用transform-origin属性设置旋转的基点，默认情况下，元素以中心点为基点旋转。
下面是一个使用rotate()函数旋转元素的示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Rotate Example</title>
<style>
.box {
width: 100px;
height: 100px;
background-color: #f00;
transform: rotate(45deg);
transform-origin: center;
}
</style>
</head>
<body>
<div class="box"></div>
</body>
</html>在上面的示例中，一个宽高都为100px的div元素被旋转了45度，效果是将正方形变成了菱形。同时，使用transform-origin属性将旋转基点设置为元素的中心点，使得元素旋转后保持原来的位置。
正文完