<!DOCTYPE html>
<html>
<head>
<style>
#div1
{
position: relative;
height: 200px;
width: 200px;
margin: 100px;
border: 1px solid black;
}
#div2
{
position: absolute;
width: 100px;
height: 100px;
line-height: 100px;
text-align:center;
border: 1px solid black;
background-color: yellow;
transform-origin: 0 0;
transform: rotate(90deg) translateY(-100px)
}
</style>
</head>
<body>
<div id="div1">
<div id="div2">HELLO</div>
</div>
</body>
</html>
将旋转中心点设置原点 旋转角度设置90度 位移距离是长方形长的长度