数据结构
网络
RDBMS
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理
化学
生物
数学
英语
经济学
心理学
社会学
时尚研究
法律研究如何在 HTML 中为多个标签添加父级？
HTML 列表项使用 <li> 标签显示。它必须由一个父元素封装。它用于在 HTML 中的各种列表中指定列表项。它用于菜单 <menu>、目录、有序列表 <ol> 和无序列表 <ul>。在有序列表中，列表元素通常以递增计数器显示。无序列表中的列表项以项目符号形式呈现。各种类型的列表如下：
有序列表
无序列表
定义列表
HTML 有序列表
元素的编号格式通过 HTML 有序列表或编号列表显示。对于有序列表，请使用 <ol> HTML 标签。使用有序列表，我们可以按数字顺序、字母顺序或任何其他突出显示顺序重要性的格式显示项目。
语法
以下是 HTML 有序列表的语法
<ol> <li>..</li> </ol>
示例
让我们看下面的示例，我们将使用有序列表创建列表。
<!DOCTYPE html>
<html>
<head>
<style>
p {
font-family: verdana;
font-size: 15px;
}
</style>
</head>
<body style="background-color:#D5F5E3">
<h1 style="color:#DE3163; font-family:verdana">Ordered List</h1>
<p>start attribute</p>
<ol start=4>
<li>BMW</li>
<li>BUGATI</li>
<li>CHERON</li>
</ol>
<p>type attribute</p>
<ol type="I">
<li>AUDI</li>
<li>RS7</li>
<li>Q4</li>
</ol>
</body>
</html>
当我们运行上述代码时，它将生成一个输出，其中包含应用于网页上显示的不同属性的有序列表。
HTML 无序列表
无序列表是相关项目的集合，这些项目没有特殊的顺序或序列。此列表是通过使用 HTML <ul> 标签创建的。列表中的每个项目都用项目符号标记。
语法
以下是 HTML 无序列表的语法
<ul> <li>…</li> </ul>
示例
在以下示例中，我们将要在网页上创建一个无序列表。
<!DOCTYPE html>
<html>
<head>
<style>
p {
font-family: verdana;
font-size: 15px;
}
</style>
</head>
<body style="background-color:#D5F5E3">
<h1 style="color:#DE3163; font-family:verdana">Unordered List</h1>
<p>Unordered list with type="square"</p>
<ul type="square">
<li>ANT</li>
<li>BAT</li>
<li>CAT</li>
<li>DOG</li>
</ul>
<p>Unordered list with type="circle"</p>
<ul type="circle">
<li>ELEPHANT</li>
<li>FISH</li>
<li>GOAT</li>
<li>HEN</li>
</ul>
</body>
</html>
运行上述代码后，输出窗口将弹出，显示网页上显示的不同类型的无序列表。
HTML 定义列表
使用 <dl> 标签添加定义列表。HTML <dl> 标签用于声明定义列表。此标签用于 <dd> 标签内。定义列表类似于其他列表，但在定义列表中，每个列表项包含两个条目：术语和描述。
语法
以下是 HTML 定义列表的语法
<dl> <dt>…</dt> <dd>…</dd> </dl>
示例
以下是如何在网页上创建定义列表的示例。
<!DOCTYPE html>
<html>
<head>
<style>
body {
font-family: verdana;
background-color: #D5F5E3;
}
h2 {
color: #DE3163;
}
</style>
</head>
<body>
<h2>Definition List</h2>
<dl>
<dt>CHERON</dt>
<dd>It's a Bucati product</dd>
<dt>Q4</dt>
<dd>It's a series in Audi</dd>
</dl>
</body>
</html>
当我们运行上述代码时，它将生成一个输出，其中包含应用了 CSS 的定义列表，显示在网页上。
更新于： 2024年1月19日
59 次查看
广告