Please use as few DIV tags and styles as possible to achieve the effects of the two images below. Regardless of compatibility, images or background images are not allowed to be used. Background colors can be used. (Pictures below)
Picture 1:
Picture 2:
div{background-color:#000;transform:rotate(-45deg);} first
<div style="overflow:hidden;_height:1%;"> <div class="a"></div> <div class="a b"></div></div><div style="overflow:hidden;"> <div class="aa"></div> <div class="aa bb"></div></div><div class="aaa"></div><div style="overflow:hidden;"> <div class="aa"></div> <div class="aa bb"></div></div><div style="overflow:hidden;_height:1%;"> <div class="a"></div> <div class="a b"></div></div>
.a{ width:10px; height:10px; background-color:#000; float:left;}.b{ margin-left:70px;}.aa{ width:20px; height:20px; background:#000; float:left; margin-left:10px;}.bb{ margin-left:30px;}.aaa{ margin-left:30px; height:30px; width:30px; background:#000;}