HTML5 表格

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>