效果图：
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>无标题文档</title> 6 <style> 7 body{margin:0;} 8 .one{width:100px; height:100px; float:left;} 9 .body{ margin:100px 100px 100px 100px;width:300px;height:100px; border:1px solid #000; border-left:0; } 10 .first{width:50px; height:100px; border:1px solid #000; float:left; border-bottom:0;} 11 .firstblack{width:50px; height:60px; border:1px solid #000; background-color:#000;} 12 .secondblack{widtn:50px; height:30px; border:1px solid #000; background-color:#000; margin-top:-62px;} 13 .two{width:100px; height:100px; overflow:hidden; float:left;} 14 .three{width:100px; height:100px; overflow:hidden; float:left;} 15 16 </style> 17 </head> 18 19 <body> 20 <div class="body"> 21 <div class="one"> 22 <div class="first"></div> 23 <div class="firstblack"></div> 24 25 <div class="secondblack"></div> 26 </div> 27 28 <div class="two"> 29 <div class="first"></div> 30 <div class="firstblack"></div> 31 32 <div class="secondblack"></div> 33 </div> 34 <div class="three"> 35 <div class="first"></div> 36 <div class="firstblack"></div> 37 38 <div class="secondblack"></div> 39 </div> 40 </div> 41 42 </body> 43 </html>
122
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
