表格的使用
1、<table>标记
1.基本格式
1 | <table 属性1="属性值1" 属性2="属性值2" ... ... >表格内容</table> |
2.table标记的属性
1.width：表格的宽度，值是像素（px）或父级元素的百分百（%）
2.height：表格的高度，值像素（px）或父级元素的百分百（%）
3.border：表格外边框的宽度
4.align：表格的显示位置，left、center、right
5.cellspacing：单元格之间的间距，默认是2px，单位像素
6.cellpadding：单元格内容与单元格边框的显示距离，单位像素
7.frame属性：控制表格边框最外层的四条线框，属性值
8.rules属性：控制是否显示以及如何显示单元格之间的分割线，属性值
2、<caption>标记
表格的标题（非必须），位于<table>属性之后，<tr>表格行之前。
align属性有：top、bottom、left、right
3、<tr>标记
定义表格的一行，对于每一个表格行，都是由一对<tr>…</tr>标记表示，每一行<tr>标记内可以嵌套多个<td>或者<th>标记，部分属性如下：
- bgcolor属性：设置背景颜色，bgcolor=”#123123”
- align属性：设置垂直方向对齐方式，align=”bottom/top/middle”
- valign属性：设置水平方向对齐方式，valign=”left/right/center”
4、<td>和<th>
1、<td>和<th>都是单元格的标记，其必须嵌套在<tr>标签内，是成对出现
2、两者的区别
1.<th>是表头标记，通常位于首行或者首列，默认加粗
2.<td>是数据标记，表示该单元格的具体数据
3、共同之处：两者的标记属性都是一样的
4、属性
| 属性 | 描述 |
|---|---|
| bgcolor | 设置单元格背景 |
| align | 设置单元格对齐方式 |
| valign | 设置单元格垂直对齐方式 |
| width | 设置单元格宽度 |
| height | 设置单元格高度 |
| rowspan | 设置单元格所占行数 |
| colspan | 设置单元格所占列数 |
| 属性 | 描述 |
|---|---|
| void(默认值) | 表示无边框 |
| above | 表示仅顶部有边框 |
| below | 表示仅有底部边框 |
| hsides | 表示仅有顶部边框和底部边框 |
| lhs | 表示仅有左侧边框 |
| rhs | 表示仅有右侧边框 |
| vsides | 表示仅有左右侧边框 |
| box | 包含全部4个边框 |
| border | 包含全部4个边框 |
| 属性 | 描述 |
|---|---|
| none(默认值) | 表示无分割线 |
| all | 表示包括所有分割线 |
| rows | 表示仅有行 |
实现如下例子
1 | <html> |