根据你的html,我得到的是
Demo.我刚刚玩转换。
.mainDiv{
position: relative;
width: 206px;
height: 190px;
margin: 0px auto;
margin-top:100px;
}
.square{
width:100px;
height:100px;
background:#c52329;
border:solid 2px #FFF;
float:left;
transform: skew(180deg,210deg);
position: absolute;
top: 43px;
}
.square2{
width:100px;
height:100px;
background:#c52329;
border:solid 2px #FFF;
float:left;
transform: skew(180deg,150deg);
position: absolute;
left:102px;
top: 43px;
}
.square3{
width:114px;
height:100px;
background:#c52329;
border:solid 2px #FFF;
float:left;
transform: rotate(150deg) translate(-40px, -16px) skew(30deg, 0deg);
position: absolute;
left: 0px;
top: -32px;
}
更新的CSS
.square3{
width:114px;
height:100px;
background:#c52329;
border:solid 2px #FFF;
float:left;
transform: rotate(150deg) translate(-40px, -16px) skew(30deg, 0deg);
position: absolute;
left: 0px;
top: -32px;
}
更改变换css与此..
希望它会帮助..让我知道如果它不为你工作..