1、认识表格

在网页制作中,表格起着重要的作用,除了用来对齐数据之外,更多的用来进行网页排版,使一些数据信息更容易浏览,因此表格在页面布局中的应用非常广泛。(例课程表、网购等)

小白学习HTML——表格           小白学习HTML——表格 

2、创建表格

创建table表格,离不开以下3对标签

<table></table>  定义一个表格

<tr></tr>   定义表格中的一行,嵌套在<table></table>中

<td></td>  定义表格中的单元格,嵌套在<tr></tr>中

3、<table>标记的属性

具体如下表所示:

小白学习HTML——表格


<table>标记的属性在实体表格中的表现如下图所示:

小白学习HTML——表格

4、<tr>标记的属性

具体如下表所示:
小白学习HTML——表格

注意:

<tr>标记无宽度属性width,其宽度取决于表格标记<table>。

对<tr>标记应用valign属性,用于设置一行内容的垂直对齐方式。

可以对<tr>标记应用background属性,但是在<tr>标记中此属性兼容问题严重。

对于<tr>标记的属性了解即可,均可用相应的CSS样式属性替代。

5、<td>标记的属性

具体如下表所示:

小白学习HTML——表格

注意:

在<td>标记的属性中,重点掌握colspan和rolspan,其他的属性了解即可,不建议使用,均可用CSS样式属性替代。

当对某一个<td>标记应用width属性设置宽度时,该列中的所有单元格均会以设置的宽度显示。

当对某一个<td>标记应用height属性设置高度时,该行中的所有单元格均会以设置的高度显示。

6、<th>标记的属性

<th></th>标记用来设置表头,其文本默认加粗居中显示。

小白学习HTML——表格

7、合并单元格

colspan与rowspan

如果要将两个或多个列合并为一个列,将使用colspan属性(<td rowspan = "2"> Row 1 Cell 1 </td>)

如果要合并两行或更多行,则将使用rowspan属性(<td colspan = "3"> Row 3 Cell 1 </td>)

小白学习HTML——表格     小白学习HTML——表格

以上是关于表格的内容!

相关文章: