CSS如何把一个元素旋转30°？
参考回答
要旋转一个元素30度，可以使用CSS中的transform属性与rotate()函数。具体的代码如下：
element {
transform: rotate(30deg);
}
这里，30deg表示将元素旋转30度。单位deg表示度数（degree），是旋转角度的常用单位。
详细讲解与拓展
CSS的transform属性允许你对元素应用各种2D或3D转换，其中之一就是旋转。rotate()函数就是用来旋转元素的，它接受一个角度值，可以是正值或负值，表示旋转的角度。
旋转的基本原理：
rotate(30deg)表示顺时针旋转30度。如果你使用负值（例如rotate(-30deg)），则表示逆时针旋转30度。- 旋转是相对于元素的中心点进行的，即使你不改变元素的位置，它会围绕其中心点进行旋转。
举例：
<div class="rotate-example">Hello, World!</div>
.rotate-example {
width: 200px;
height: 100px;
background-color: lightblue;
text-align: center;
line-height: 100px;
transform: rotate(30deg);
}
在这个例子中，<div>元素将会被旋转30度，且文本会随之旋转。
旋转的影响：
旋转操作不会改变元素的布局位置，但会影响元素的外观。如果旋转后的元素超出了原来的容器边界，可以使用transform-origin来调整旋转的基准点。例如，transform-origin: top left;会使元素围绕其左上角旋转。
总结：
- 使用
transform: rotate(30deg);即可将元素旋转30度。 - 旋转是相对于元素的中心点进行的，可以通过调整
transform-origin来改变旋转的基准点。