HTML5基础之无序列表和有序列表_页面上只要是带有规则的排序文字一般用的都是无序列表

作者：从前慢现在也慢 | 2024-03-28 08:24:38

踩

页面上只要是带有规则的排序文字一般用的都是无序列表

一、无序列表

使用场景：在网页中表示一组无顺序之分的列表，如新闻等。

标签组成：

标签名	说明
ul	表示无序列表的整体，用于包裹li标签
li	表示无序列表的每一项，用于包含每一行的内容

注：ul标签只能包含li标签， li标签可以包含任意内容。

代码示例：


<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>web-study</title>
</head>
<body>
<ul>
	<li>香蕉</li>
	<li>苹果</li>
	<li>梨子</li>
</ul>
</body>
</html>

执行结果：

二、有序列表

使用场景：在网页中表示一组有顺序之分的列表，如排行榜等。

标签组成：

标签名	说明
ol	表示有序列表的整体，用于包裹li标签
li	表示有序列表的每一项，用于包含每一行的内容

代码示例：


<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>web-study</title>
</head>
<body>
<ol>
	<li>香蕉</li>
	<li>苹果</li>
	<li>梨子</li>
</ol>
</body>
</html>

执行结果：

本文内容由网友自发贡献，转载请注明出处：【wpsshop博客】

HTML5基础之无序列表和有序列表_页面上只要是带有规则的排序文字 一般用的都是无序列表

HTML5基础之无序列表和有序列表_页面上只要是带有规则的排序文字一般用的都是无序列表