如何实现九宫格布局-----源码如下 

 1 <html>
 2 <body>
 3 <!--不行-->
 4 <table width="600px">
 5 <tr>
 6     <td style="width:200px;float:left">111</td>
 7     <td style="width:200px;float:left">222</td>
 8     <td style="width:200px;float:left">333</td>
 9     <td style="width:200px;float:left">44</td>
10     <td style="width:200px;float:left">55</td>
11     <td style="width:200px;float:left">66</td>
12     <td style="width:200px;float:left">77</td>
13 </tr>    
14 </table>
15 
16 <!--行-->
17 <div style="width:600px">
18     <div style="width:200px;float:left">111</div>
19     <div style="width:200px;float:left">111</div>
20     <div style="width:200px;float:left">111</div>
21     <div style="width:200px;float:left">111</div>
22     <div style="width:200px;float:left">111</div>
23     <div style="width:200px;float:left">111</div>
24     <div style="width:200px;float:left">111</div>
25 </div>
26 </body>
27 </html>

 

posted @ 2016-12-15 14:11  奋斗的少年WH  阅读(556)  评论(0)    收藏  举报