第八节表格
1.标准的表格
table:表格标签
aligh:对齐方式
cellpading:规定单元边沿与其内容之间的空白。
cellspacing:属性规定的是单元之间的空间
tr:行
td:列
th:表头
横向合并
colsapn=“number”:合并横向的表格
代码:
<table border="1px" align="center" cellpadding="0px" cellspacing="0px" width="800px"> <tr> <th colspan="3">横着的表头</th> </tr> <tr> <th>表头1</th> <th>表头2</th> <th>表头3</th> </tr> <tr> <td>1</td> <td>1</td> <td>1</td> </tr> <tr> <td>1</td> <td>1</td> <td>1</td> </tr> <tr> <td>1</td> <td>1</td> <td>1</td> </tr> </table>
演示:
横着的表头 | ||
---|---|---|
表头1 | 表头2 | 表头3 |
1 | 1 | 1 |
1 | 1 | 1 |
1 | 1 | 1 |
竖向合并
rowspan=“number”:合并竖向的表格
代码:
<table border=“1px” align=“center” cellpadding=“0px” cellspacing=“0px” width=“800px”>
竖着的表头
表头1
1
1
1
表头1
1
1
1
表头1
1
1
1
表头1
1
1
1
演示:
竖着的表头 | 表头1 | 1 | 1 | 1 |
---|---|---|---|---|
表头1 | 1 | 1 | 1 | |
表头1 | 1 | 1 | 1 | |
表头1 | 1 | 1 | 1 |
2.表格的框架
框架主要的区别就是在于表格的边框的方向不一样
box框架
代码:
<table frame=“box” cellspacing=“0px” cellpadding=“0px” width=“800px” align=“center”>
months
saves
January
$400
May
$400
演示:
months | saves |
---|---|
January | $400 |
May | $400 |
above框架
代码:
<table frame=“above” cellspacing=“0px” cellpadding=“0px” width=“800px” align=“center”>
months
saves
January
$400
May
$400
演示:
months | saves |
---|---|
January | $400 |
May | $400 |
below框架
代码:
<table frame=“below” cellspacing=“0px” cellpadding=“0px” width=“800px” align=“center”>
months
saves
January
$400
May
$400
演示:
months | saves |
---|---|
January | $400 |
May | $400 |
hsides框架
代码:
<table frame=“hsides” cellspacing=“0px” cellpadding=“0px” width=“800px” align=“center”>
months
saves
January
$400
May
$400
演示:
months | saves |
---|---|
January | $400 |
May | $400 |
vsides框架
代码:
<table frame=“vsides” cellspacing=“0px” cellpadding=“0px” width=“800px” align=“center”>
months
saves
January
$400
May
$400
演示:
months | saves |
---|---|
January | $400 |
May | $400 |
hsides框架
代码:
<table frame=“hsides” cellspacing=“0px” cellpadding=“0px” width=“800px” align=“center”>
months
saves
January
$400
May
$400
演示:
months | saves |
---|---|
January | $400 |
May | $400 |
lhs框架
代码:
<table frame=“lhs” cellspacing=“0px” cellpadding=“0px” width=“800px” align=“center”>
months
saves
January
$400
May
$400
演示:
months | saves |
---|---|
January | $400 |
May | $400 |
rhs框架
代码:
<table frame=“rhs” cellspacing=“0px” cellpadding=“0px” width=“800px” align=“center”>
months
saves
January
$400
May
$400
演示:
months | saves |
---|---|
January | $400 |
May | $400 |