HTML5 表格
1、表格<table></table>
2、表行<tr></tr>
3、单元格<td></td>
属性:
标签 | 属性 | 取值 | 说明 |
<table></table> | border | 数字 | 设置表格边框的宽度,以px为单位 |
width |
数字 | 设置表格的宽度,以px为单位 | |
height |
数字 | 设置表格的高度,以px为单位 | |
align |
left,right,center | 设置表格在父元素中的水平对齐方式 | |
cellpadding | 数字 | 设置单元格内边距,以px为单位 | |
cellspacing | 数字 | 设置单元格外边距,以px为单位 默认为1,一般设置为0 |
|
<tr></tr> | align |
left,right,center | 设置当前行文本的水平对齐方式,默认left |
valign | top,bottom,middle | 设置当前行文本的垂直对齐方式,默认middle | |
bgcolor | red,blue... | 设置当前行的背景颜色 | |
<td></td> | width |
数字 | 设置当前单元格宽度,以px为单位 |
height | 数字 | 设置当前单元格高度,以px为单位 | |
bgcolor | red,blue... | 设置当前单元格的背景颜色 | |
align |
left,right,center | 设置当前单元格文本水平对齐方式,默认left | |
valign | top,bottom,middle | 设置当前单元格文本垂直对齐方式,默认middle | |
bgcolor | red,blue... | 设置当前单元格的背景颜色 | |
colspan | 数字 | 跨列合并单元格 | |
rowspan | 数字 | 跨行合并单元格 |
4、行分组
表头行分组 <thead></thead>
表尾行分组<tfoot></tfoot>
表主体行分组<tbody></tbody>
<table border="1" width="400" align="center" cellpadding="5" cellspacing="0">
<thead bgcolor="blue" align="center">
<tr>
<td colspan="3">图书</td>
</tr>
</thead>
<tbody bgcolor="yellow" align="center">
<tr>
<td rowspan="2">信息</td>
<td>书名:</td>
<td>python</td>
</tr>
<tr>
<td>作者:</td>
<td>山姆</td>
</tr>
</tbody>
<tfoot align="center">
<tr>
<td colspan="2">价格:</td>
<td>28.5</td>
</tr>
</tfoot>
</table>