表格布局（table）：
<!--每个表格从一个 table 标签开始。-->
<!--每个表格行从 tr 标签开始。-->
<!--每个表格的数据从 td 标签开始。-->
<!--每个表格的th标签代表每个表个的表头-->
<!--cellpadding代表的是边框与其内容的间隙大小-->
<!--cellspacing 是边框与边框之间的间隙大小-->
<table style="text-align: center" width="300px" border="1px">
<tr><th>这是表格的表头部分</th><th>这是表格的表头部分</th><th>这是表格的表头部分</th></tr>
<tr><td>九宫格</td><td>九宫格</td><td>九宫格</td></tr>
<tr><td>九宫格</td><td>九宫格</td><td>九宫格</td></tr>
<tr><td>九宫格</td><td>九宫格</td><td>九宫格</td></tr>
<tr><td>九宫格</td><td>九宫格</td><td>九宫格</td></tr>
<tr><td>九宫格</td><td>九宫格</td><td>九宫格</td></tr>
<tr><td>九宫格</td><td>九宫格</td><td>九宫格</td></tr>
<tr><td>九宫格</td><td>九宫格</td><td>九宫格</td></tr>
</table>
table表格拆分合并（colspan、rowspan）
colspan横向合并表格
必须指定要合并的列数目，是两列还是三列等等
rowspan纵向合并表格
同样必须指定要合并的列数目，是两列还是三列等等
<table border="1" cellspacing="0" width="50%" height="150">
<caption>合并单元格</caption>
<tr><th>班级</t> <th colspan="2">姓名和年龄</th> <th>电话</th> </tr>
<tr><td rowspan="2">601班</td> <td>Jack</td> <td>24</td> <td>1351234567</td> </tr>
<tr> <td>Tom</td> <td>22</td> <td>1351234567</td> </tr>
<tr><td rowspan="3">602班</td> <td>Rose</td> <td>22</td> <td>1351234567</td> </tr>
<tr> <td>张三</td> <td>25</td> <td>1351234567</td> </tr>
<tr> <td>李四</td> <td>25</td> <td>1351234567</td> </tr>
</table>
合并表格
tip:表格布局学习的时候可是简单了解一下他的基本用法 ，不用深入研究。
div盒子布局比表格布局的优势：
TABLE布局是WEB早期CSS不存在的时候兴起的，是对TABLE标签的不正规使用，Table标签就是表格，是用来显示数据的，而不是用来布局网页的，虽然它有时候布局网页很简单。现在绝大多数的网站都是用DIV+CSS布局。这两种布局各有各的优点。
div盒子布局的好处
1.符合W3C标准，代码结构清晰明了，结构、样式和行为分离，带来足够好的可维护性。
2.布局精准，网站版面布局修改简单。
3.加快了页面的加载速度（最重要的）（在IE中要将整个table加载完了才显示内容）。
4.节约站点所占的空间和站点的流量。
5.用只包含结构化内容的HTML代替嵌套的标签，提高另外搜索引擎对网页的搜索效率。
tbale布局好处：
1.容易上手。
2.可以形成复杂的变化，简单快速。
3.表现上更加“严谨”，在不同浏览器中都能得到很好的兼容。
网友评论