2D旋转基础样式

2D重叠旋转
#o
{
position: relative;
top: 400px;
left: 400px;
}
.aa{
width:300px;
height:300px;
position: absolute;
transform-origin:0% 100%;
transition: 2s;
}
#a
{
background-color:red;
transform: rotate(10deg);
}
.aa:hover{
z-index: 10;
}
#b
{
background-color:yellow;
transform: rotate(20deg);
}
#c
{
background-color:darkgray;
transform: rotate(30deg);
}
#d
{
background-color:aquamarine;
transform: rotate(40deg);
}

主要关键 z-index 顺序定位元素