HTML 列表的类型

cssweb developmentfront end technology更新于 2025/2/6 6:04:17

HTML 中有三种类型的列表 −

无序列表 <ul>
此列表包含无特定顺序的项目符号列表项。
有序列表 <ol>
此列表用于显示有序列表项
定义列表 <dl>
此列表用于显示术语的定义。

我们可以嵌套这些列表并根据需要设置样式。CSS 属性 list-style 帮助我们设置列表项的样式。

语法

HTML 列表的语法如下 −

<type of list>
<li></li>
</type of list>

以下示例演示了 HTML 列表 −

示例

<!DOCTYPE html>
<html>
<head>
<style>
ul {
   background-color: papayawhip;
   list-style-type: square;
   font-style: italic;
}
ol {
   background-color: azure;
}
</style>
</head>
<body>
<ol>
<li>demo1</li>
<li>
demo 2
<ul>
<li>demo a</li>
<li>demo b</li>
</ul>
</li>
<li>demo 3</li>
</ol>
</body>
</html>

输出

这将给出以下输出 −

示例

<!DOCTYPE html>
<html>
<head>
<style>
dt {
   font-weight: bold;
   font-style: italic;
}
dd {
   border: thin dotted;
}
</style>
</head>
<body>
<h2>Programming Languages and Databases</h2>
<dl>
<dt>Java</dt>
<dd>A programming language developed by James Gosling.</dd>
<dt>C++</dt>
<dd>A programming language developed by Bjarne Stroustrup.</dd>
<dt>MySQL</dt>
<dd>MySQL is an open-source relational database management system.</dd>
</dl>
</body>
</html>