HTML <table> 标签用于在网页上创建表格,表格由行和列组成,可以用来展示数据或布局页面内容。
语法
// www.javascriptcn.com code example
<table>
<tr>
<th>表头1</th>
<th>表头2</th>
</tr>
<tr>
<td>数据1</td>
<td>数据2</td>
</tr>
</table>属性
border: 设置表格边框的大小cellpadding: 设置单元格内边距cellspacing: 设置单元格之间的间距width: 设置表格宽度height: 设置表格高度align: 设置表格水平对齐方式valign: 设置表格垂直对齐方式
示例
// www.javascriptcn.com code example
<table border="1" cellpadding="5" cellspacing="0" width="100%">
<tr>
<th>姓名</th>
<th>年龄</th>
</tr>
<tr>
<td>张三</td>
<td>25</td>
</tr>
<tr>
<td>李四</td>
<td>30</td>
</tr>
</table>注意事项
<table>标签必须包含至少一个<tr>标签,<tr>标签代表表格中的一行- 每行中使用
<th>标签定义表头单元格,使用<td>标签定义数据单元格 - 使用 CSS 样式来美化表格,避免使用过多的边框和颜色,保持简洁易读
| 属性 | 值 | 描述 |
|---|---|---|
| align | left center right | HTML5 不支持。HTML 4.01 已废弃。 规定表格相对周围元素的对齐方式。 |
| bgcolor | rgb(x,x,x) #xxxxxx colorname | HTML5 不支持。HTML 4.01 已废弃。 规定表格的背景颜色。 |
| border | 1 | HTML5 不支持。规定表格单元是否拥有边框。 |
| cellpadding | pixels | HTML5 不支持。规定单元边沿与其内容之间的空白。 |
| cellspacing | pixels | HTML5 不支持。规定单元格之间的空白。 |
| frame | void above below hsides lhs rhs vsides box border | HTML5 不支持。规定外侧边框的哪个部分是可见的。 |
| rules | none groups rows cols all | HTML5 不支持。规定内侧边框的哪个部分是可见的。 |
| summary | text | HTML5 不支持。规定表格的摘要。 |
| width | pixels % | HTML5 不支持。规定表格的宽度。 |