【HTML】05-三种列表

最新推荐文章于 2023-12-09 10:30:37 发布

JeffHan^_^

最新推荐文章于 2023-12-09 10:30:37 发布

阅读量327

点赞数 1

CC 4.0 BY-SA版权

分类专栏： HTML教程文章标签： html5 html 前端

本文链接：https://blog.youkuaiyun.com/Jeffhan_java/article/details/123368572

HTML教程专栏收录该内容

11 篇文章

订阅专栏

<!--
    三种列表：
        1.无序列表：
            unordered list
            属性节点type：用于指定标记样式，none，circle，disc，square
        2.有序列表
            ordered list
            属性节点type：用于指定序号样式：1，A，a，I，i
        3.自定义列表
            definition list
            dt标签：列表项目的标题
            dd标签：项目的子项
        4.列表可以嵌套使用
        5.快捷键生成列表，例如：ul*2>li*3 + tab键生成两个ul，每个ul里面有三个li
-->

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>三种列表</title>
	</head>
	<body>
		<!-- 无序列表 -->
		<ul type="circle">
			<li type="square">张三</li>
			<li type="disc">李四</li>
			<li>王五</li>
		</ul>
		
		<!-- 有序列表 -->
		<ol type="i">
			<li>张三</li>
			<li>李四</li>
			<li>王五</li>
		</ol>
		
		<!-- 定义列表 -->
		<dl>
			<dt>男生</dt>
			<dd>张三</dd>
			<dd>李四</dd>
			<dt>女生</dt>
			<dd>小红</dd>
			<dd>小兰</dd>
		</dl>
		
		<!-- 列表嵌套 -->
		<ul>
			<li>
				<ol>
					<li>666</li>
					<li>666</li>
					<li>666</li>
				</ol>
			</li>
			<li>
				<ol>
					<li>888</li>
					<li>888</li>
					<li>888</li>
				</ol>
			</li>
		</ul>
		
	</body>
</html>