css 旋转 div 盒子

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			.xuanzhuan{
				width: 300px;
				height: 300px;
				position: relative;
				top: 250px;
				left: 550px;
				background-color: #FF8C00;
				/* transform: rotate(333deg); */
			}
		</style>
	</head>
	<body>
		<div class="xuanzhuan">
		
		</div>
	</body>
</html>

关键代码是:/* transform: rotate(333deg); */

旋转前:

image.png

将关键代码注释解开:

transform: rotate(333deg);

image.png

还可以在开发者工具中任意旋转。任意旋转指针即可。

image.png

  • CSS

    CSS(Cascading Style Sheet)“层叠样式表”是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。

    168 引用 • 416 回帖

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...