HTML里的列表是一种用于展示一系列相关项目的元素,它可以使网页的内容更加有条理和清晰。HTML里的列表有三种类型:
1、无序列表(Unordered List):用于表示没有特定顺序的项目列表,每个项目的标记通常是默认的实心圆点符号。无序列表使用 <ul> 标签来定义,每个列表项使用 <li> 标签来定义。例如:
<ul>
<li>苹果</li>
<li>香蕉</li>
<li>橘子</li>
</ul>
ul标签中含有type属性,可用于更改项目中的标记:
‘disc’为默认属性,前面用实心小圆点 ;‘circle’为空心圆;‘square’代表前面是小方块;‘none‘则代表无显示。
上面的代码会在网页上显示如下:
• 苹果
• 香蕉
• 橘子
2、有序列表(Ordered List):用于表示按照一定顺序排列的项目,每个项目都有对应的数字或字母标记。有序列表使用 <ol> 标签来定义,每个列表项使用 <li> 标签来定义。例如:
<ol>
<li>打开浏览器</li>
<li>输入网址</li>
<li>点击搜索按钮</li>
</ol>
ol中也有type属性来更改前面标记:
‘1’是默认属性,列表排序用数字标号;‘a’为小写字母标号;‘A’为大写字母标号;‘i’为小写罗马字母标号;‘I’为大写罗马字母标号。
上面的代码会在网页上显示如下:
1. 打开浏览器
2. 输入网址
3. 点击搜索按钮
3、 定义列表(Definition List):用于表示一组术语及其对应的定义或描述,每个术语和对应的定义通常使用 <dt> 和 <dd> 标签进行标记。定义列表使用 <dl> 标签来定义。例如:
<dl>
<dt>HTML</dt>
<dd>超文本标记语言,用于创建网页的结构和内容</dd>
<dt>CSS</dt>
<dd>层叠样式表,用于设置网页的样式和布局</dd>
<dt>JavaScript</dt>
<dd>一种脚本语言,用于实现网页的交互和动态效果</dd>
</dl>
上面的代码会在网页上显示如下:
HTML
: 超文本标记语言,用于创建网页的结构和内容
CSS
: 层叠样式表,用于设置网页的样式和布局
JavaScript
: 一种脚本语言,用于实现网页的交互和动态效果
有序列表和无序列表都可进行嵌套使用。
快捷键:ul>li*3——生成三个无序表的li标签