HTML_列表

最新推荐文章于 2023-05-10 16:24:31 发布

「已注销」

最新推荐文章于 2023-05-10 16:24:31 发布

阅读量204

点赞数

分类专栏： HTML学习

本文链接：https://blog.csdn.net/dolola/article/details/79118256

版权

HTML学习专栏收录该内容

37 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>practice</title> 
</head>
	<body>
		<h3>默认无序列表</h3>
		<ul>
			<li>星期一</li>
			<li>星期二</li>
			<li>星期三</li>
		</ul>
		<h3>圆圈无序列表</h3>
		<ul style="list-style-type:circle">
			<li>星期一</li>
			<li>星期二</li>
			<li>星期三</li>
		</ul>
		<h3>正方形无序列表</h3>
		<ul style="list-style-type:square">
			<li>星期一</li>
			<li>星期二</li>
			<li>星期三</li>
		</ul>
		<h3>默认有序列表</h3>
		<ol start="0">
			<li>星期一</li>
			<li>星期二</li>
			<li>星期三</li> 
		</ol>
		<h3>大写字母有序列表</h3>
		<ol type="A" start="3">       <!--这里的三不是指数字三而是指序列第三个-->
			<li>星期一</li>
			<li>星期二</li>
			<li>星期三</li> 
		</ol>
		<h3>有序列表</h3>
		<ol type="I">
			<li>星期一</li>
			<li>星期二</li>
			<li>星期三</li> 
		</ol>
		<h3>自定义列表</h3>
		<dl>
			<dt>Math</dt>
			<dd>烂死了</dd>
			<dt>English</dt>
			<dd>一般般</dd>
		</dl>
		<h4>嵌套链表</h4>
		<ul>
			<li>Coffee</li>
			<li>Tea
				<ul style="list-style-type:circle">
					<li>Black Tea</li>
					<li>Green Tea
						<ul style="list-style-type:square">
							<li>China</li>
							<li>Japan</li>
						</ul>
					</li>
				</ul>
			<li>Milk</li>
		</ul>
		<h4>一个自定义列表：</h4>
		<dl>
		  <dt>Coffee</dt>
		  <dd>- black hot drink</dd>
		  <dt>Milk</dt>
		  <dd>- white cold drink</dd>
		</dl>
					
	
	</body>
</html>

昨晚看到了列表，太困就直接睡了，早晨（或许可以说是中午）起床补一下。

首先列表分为有序表、无序表和自定义标签，前者用<ol>包裹后者用<ul>包裹。

先复习有序表，默认的顺序是按照从1开始的阿拉伯数字排序（当然，可以用start来更改起始数字，即在ol后面加start="2"表示从2开始排序，除此之外，还可以通过type来更改排序的方式，比如按照字母A或者罗马数字来排序，注意区分大小写）

其次是无序表，默认的是用小黑点表示每一列的开始(与有序表相同，可以更改小黑点为其他形状，通过syle="list-style-type:square",这样就把小黑点变成了实心正方形。）

自定义标签通过<dl>包裹，<dt> > <dd>而且<dd>标签会缩进。

还有就是标签内的嵌套结构，和表格的嵌套即为相似，大致都是通过“包裹”的思想实现，即外层标签包裹内层标签。

之前虽然知道可以插代码，但是没找到，今天不小心点到了，哈哈。麻烦各位帮忙看看代码风格。

新手上路，欢迎斧正。