web前端开发与应用——分组元素

div

div元素是没有语义的通用分组元素，早期设计中常用div标签进行网页布局。

blockquote

blockquote元素表示摘自另一个源的大段内容的语义化元素。在显示上有段落空隙，在左右两边缩进（增加外边距）。

pre

pre元素用来定义预格式化文本，在<pre>标签内容中的文本通常会保留空格和换行符，显示为等宽字体。

figure/figcaption

figure元素代表一个和文档相关的图，figcaption是这个图的标题。

ul/li

ul可创建无序列表，在这个标签中可以用li标签设置多个列表项。基本格式如下：

1. <ul>
2. <li>无序列表项1</li>
3. <li>无序列表项2</li>
4. <li>无序列表项3</li>
5. </ul>

无序列表<ul>有一个可选属性type，用来规定列表里项目符号的类型,其取值可以是disk(实心圆）、circle（圆）或square（实心正方形）。

ol/li

ol可创建有序列表，在这个标签中可以用li标签设置多个列表项，显示时每个列表项独占一行。基本格式如下：

1. <ol>
2. <li>有序列表项1</li>
3. <li>有序列表项2</li>
4. <li>有序列表项3</li>
5. </ol>

在HTML5中，有序列表<ol>有三个可选属性，type用来规定列表里项目编号的类型，start属性用于指定列表的开始编号，reversed属性用于将列表反向进行编号。

dl/dt,dd

dl可创建定义列表，在这个标签中可以用dt标签设置需要定义的术语，每个术语后可用1~n个dd标签设置定义的解释体。基本格式如下：

1. <dl>
2. <dt>术语</dt>
3. <dd>术语解释1</dd>
4. <dd>术语解释2</dd>
5. </cl>

应用时注意，一个列表中不允许含有相同名字的术语，也不允许有重复的术语解释。

定义列表

dl元素用于设置定义列表，它由两部分组成：定义名词和定义描述。dt元素设置定义名词，dd元素设置定义的描述。示例例如：

1. <dl>
2. <dt>平行四边形</dt>
3. <dd>平行四边形是在同一个二维平面内，由两组平行线段组成的闭合图形。</dd>
4. <dd>在欧几里德几何中，平行四边形是具有两对平行边的简单（非自相交）四边形。</dd>
5. </dl>

显示效果为：

例题

关于定义无序列表的基本语法格式，以下描述错误的是（D ）。

A、

<ul></ul>标记用于定义无序列表 

B、

<li></li>标记嵌套在<ul></ul>标记中，用于描述具体的列表项 

C、

每对<ul></ul>中至少应包含一对<li></li> 

D、

<li>不可以定义type属性，只能使用CSS样式属性代替

在HTML中，元素pre的作用是（C ）

A、

表示标题

B、

表示转行

C、

表示预排版

D、

表示文字效果

有序列表示例

HTML中的ol元素表示排序的项目列表，属性type 可设置列表符号样式，取值为1表示按数字排序，取值为A表示按大写英文字母排序，取值为a表示按小写英文字母排序，取值为I表示按大写罗马数字排序，取值为i表示按小写罗马数字排序，默认按数字排序。属性start 设置列表符号初值，取值可以是1、2、3 ...,例如以下代码：

1. <ol start=2>
2. <li type=A>男装</li>
3. <li type=i>上衣</li>
4. <li type=I>T恤</li>
5. </ol>

显示效果为：

fieldset标签

fieldset标签用于定义表单的一个子容器，将所包含的内容以边框环绕方式显示。 fieldset标签没有必需的或唯一的属性，可添加的属性有：

• name：规定fieldset的名称
• form：规定fieldset所属的一个或多个表单
• disabled：规定该组中的相关表单元素被禁用

legend标签

legend标签用于定义分组的标题，fieldset标签中的第一个元素一般是legend标签。