700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > html中table标签 tr标签 th标签 td标签的基础知识

html中table标签 tr标签 th标签 td标签的基础知识

时间:2023-06-14 07:55:53

相关推荐

html中table标签 tr标签 th标签 td标签的基础知识

html中table标签、tr标签、th标签、td标签的基础知识

表格的结构表格的基本标签表格标签的基本属性table标签的基本属性tr标签的基本属性th和td标签的基本属性表格高级样式设置相关概念外边框线样式属性frame内部边框样式属性rules单元格合并水平方向单元格的合并垂直方向单元格的合并相关概念选择题及参考答案选择题参考答案

表格的结构

在基本表格结构中,表格标题项目表头数据资料构成了表格基本结构三个要素。

例如下图所示的表格中,表格标题为“通讯录”,表格第一行单元格中的内容基本不变,称作项目表头,表格第二行后单元格的内容通常会动态改变,称作数据资料。

基本表格

源代码

<!DOCTYPE html><html><head><meta charset="utf-8"><title>通讯录</title></head><body><table border="2"><caption align="center">通讯录</caption><tr><th>姓名</th><th>QQ</th><th>联系电话</th></tr><tr><td>张三</td><td>123456789</td><td>123456789</td></tr></table></body></html>

表格的基本标签

HTML表格由table标签以及一个或多个tr、th或td标签组成:

table标签:定义一个表格caption标签:定义表格标题,嵌套在<table></table>中tr标签:定义表格中的一行,嵌套在<table></table>中th标签:定义表格中的表头单元格,嵌套在<tr></tr>中td标签:定义表格中的数据单元格,嵌套在<tr></tr>

表格标签的基本属性

table标签的基本属性

table标签的基本属性如下图所示:

tr标签的基本属性

tr标签的基本属性如下图所示:

th和td标签的基本属性

th和td标签的基本属性如下图所示:

表格高级样式设置相关概念

外边框线样式属性frame

表格的外边框线的样式可用属性frame的取值来确定,frame取值与相应的样式如下:

above:显示上边框below:显示下边框hsides:显示上下边框vsides:显示左右边框lhs:显示左边框rhs:显示右边框border:显示上下左右边框void:不显示边框

内部边框样式属性rules

表格的内部边框的样式可用属性rules的取值来确定,rules取值与相应的样式如下:

all:显示所有内部边框none:不显示内部边框rows:仅显示行边框cols:仅显示列边框groups:显示介于行组和列组间边框

单元格合并

在制作稍复杂的表格时,需要对表格中的行或列进行合并。

水平方向单元格的合并

需要将水平方向的单元格合并时,可在或标记中添加colspan属性,属性的取值即为合并的单元格数目。

垂直方向单元格的合并

需要将垂直方向的单元格合并时,可在或标记中添加rowspan属性,属性的取值即为合并的单元格数目。

相关概念选择题及参考答案

选择题

1、定义表格的项目表头的HTML标签是( )。

A、

<table>

B、

<tr>

C、

<td>

D、

<th>

2、下列选项中,用于设置表格背景颜色的属性是( )。

A、

background

B、

bgcolor

C、

bordercolor

D、

backgroundcolor

3、要使表格的行高为18px,以下方法中,正确的是( )

A、

<table height="18px">...</table>

B、

<th height="18px">...</th>

C、

<tr height="18px">...</tr>

D、

<td height="18px">...</td>

4、下列选项中,用于设置表格标题的标签是( )

A、

<title>...</title>

B、

<h1>...</h1>

C、

<tags>...</tags>

D、

<caption>...</caption>

5、下列设置单元格中文本对齐方式的选项中,正确的是( )

A、

<th align="center" valign="center">...</th>

B、

<th align="center" valign="middle">...</th>

C、

<th align="middle" valign="center">...</th>

D、

<th align="middle" valign="middle">...</th>

6、下列选项中,用于设置表格内部边框线显示的属性是( )。

A、

border

B、

frame

C、

rules

D、

innerborder

7、如果希望表格的外部边框只显示上下两条边框线,属性frame的取值应选( )。

A、

hsides

B、

vsides

C、

lhs

D、

rhs

8、如果希望表格的内部边框只显示行线,则属性rules的取值应选( )。

A、

line

B、

rows

C、

cols

D、

groups

9、HTML中,若合并两个水平方向单元格,应使用的属性是( )。

A、

colspan

B、

nospan

C、

rowspan

D、

colwrap

10、<table rules=cols>,表示( )

A、

显示所有分隔线

B、

只显示组(Groups)与组之间的分隔线

C、

只显示行与行之间的分隔线

D、

只显示列与列之间的分隔线

参考答案

1、D

2、B

3、C

4、D

5、B

6、C

7、A

8、B

9、A

10、D

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。