1.组成
table 定义表格
tr 行
td 列(单元格)
例子:
<table> <tr> <th>Month</th> <th>Savings</th> </tr> <tr> <td>January</td> <td>$100</td> </tr> </table>
属性介绍:
border: 设置表格边框
设置表格宽度
Height: 设置高度
cellspacing:设置单元格之间的距离
cellpadding:文字距离单元格边框的距离
table { border-collapse:collapse; //表格边框合并为单一边框 border-spacing:0; //属性设置相邻单元格的边框间的距离(仅用于“边框分离”模式)。 }
bgcolor="red" 设置背景颜色
align=center left| right 给td或者tr设置让文字居中, table设置表格居中
<th></th> 设置表格标题,用法和td一样
例子:
<table border="1" width="400" height="300" cellspacing="0" cellpadding="20" bgcolor="red"> <caption><h3>人员信息表</h3></caption> <tr> <td>姓名</td> <td>年龄</td> <td>职业</td> <td>籍贯</td> </tr> <tr> <td>小红</td> <td>28</td> <td>挖掘机</td> <td>山东</td> </tr> </table>
2.单元格合并
横向合并:
<tr> <td>姓名</td> <td colspan="2">年龄</td> <td>职业</td> <td>籍贯</td> </tr>
纵向合并:
<tr> <td>姓名</td> <td rowspan="2">年龄</td> <td>职业</td> <td>籍贯</td> </tr> <tr> <td>小红</td> <td>28</td> <td>挖掘机</td> <td>山东</td> </tr>
3.表格结构
<table> <thead></thead> 头 <tbody></tbody> 身体 <tfoot></tfoot> 脚 </table>