HTML有三种列表:
## 一、有序列表
有序列表(Ordered lists):用数字或字母来标记列表项,每个列表项前会有一个数字或字母。

```html
<ol>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
</ol>
```
## 二、 无序列表
无序列表(Unordered lists):用符号来标记列表项,每个列表项前会有一个符号,常用的符号有圆点、方块和实心圆点。

```html
<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
</ul>
```
## 三、定义列表
定义列表(Definition lists):用于定义术语或概念,每个列表项由一个术语和对应的定义组成。

```html
<dl>
<dt>术语1</dt>
<dd>定义1</dd>
<dt>术语2</dt>
<dd>定义2</dd>
<dt>术语3</dt>
<dd>定义3</dd>
</dl>
```

这些列表都可以使用CSS样式进行美化和自定义。

## 四、列表样式
### 无标记符号

去除无序的圆点,属性:style="list-style:none"
```
<ul>
<li style="list-style:none">苹果</li>
<li>香蕉</li>
<li style="list-style:none">葡萄</li>
</ul>
```
结果
![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/19f2401eabe24a8f81c6694a92e7a10a.png)
### 空心圆
将实心圆换成空心圆,属性:style="list-style:circle"
```
<ul>
<li style="list-style:circle">苹果</li>
<li>香蕉</li>
<li style="list-style:circle">葡萄</li>
</ul>
```
结果
![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/0c14df7c1c0344f5ae771d8536bd63ca.png)

### 正方形
将实心圆换成正方形,属性:style="list-style:square"
```
<ul>
<li style="list-style:square">苹果</li>
<li>香蕉</li>
<li style="list-style:square">葡萄</li>
</ul>
```
结果
![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/c7c1b7bb0b7345f18e333eb775139065.png)
### 数字
无序也可以当有序用
```
<ul>
<li style="list-style:decimal">苹果</li>
<li>香蕉</li>
<li style="list-style:decimal">葡萄</li>
</ul>
```
结果
![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/c43bd2a1da354e13a070aff2dca17d41.png)

HTML中的三个列表,具体的使用及列表样式的更多相关文章

  1. 翻译《Writing Idiomatic Python》(三):变量、字符串、列表

    原书参考:http://www.jeffknupp.com/blog/2012/10/04/writing-idiomatic-python/ 上一篇:翻译<Writing Idiomatic ...

  2. MySQL buffer pool中的三种链

    三种page.三种list.LRU控制调优 一.innodb buffer pool中的三种页 1.free page:从未用过的页 2.clean page:干净的页,数据页的数据和磁盘一致 3.d ...

  3. HTTP协议扫盲(三)HTTP协议的请求头列表和分类描述

    一.请求报头和响应报头列表 1.Requests 头列表 Header 解释 示例 Accept 指定客户端能够接收的内容类型 Accept: text/plain, text/html Accept ...

  4. Java三大框架之——Hibernate中的三种数据持久状态和缓存机制

    Hibernate中的三种状态   瞬时状态:刚创建的对象还没有被Session持久化.缓存中不存在这个对象的数据并且数据库中没有这个对象对应的数据为瞬时状态这个时候是没有OID. 持久状态:对象经过 ...

  5. 创建如下三个类:(People类中的三个方法分别输出一些信息,ChinaPeople 和AmericanPeople类重写父类的三个方法)。

    创建如下三个类:(People类中的三个方法分别输出一些信息,ChinaPeople 和AmericanPeople类重写父类的三个方法). ackage com.chuoji.text01; pub ...

  6. Java集合-5. (List)已知有一个Worker 类如下: 完成下面的要求 1) 创建一个List,在List 中增加三个工人,基本信息如下: 姓名 年龄 工资 zhang3 18 3000 li4 25 3500 wang5 22 3200 2) 在li4 之前插入一个工人,信息为:姓名:zhao6,年龄:24,工资3300 3) 删除wang5 的信息 4) 利用for 循

    第六题 5. (List)已知有一个Worker 类如下: public class Worker { private int age; private String name; private do ...

  7. asp.net发布到IIS中出现错误:处理程序“PageHandlerFactory-Integrated”在其模块列表中有一个错误模块“ManagedPipelineHandler”

    asp.net发布到IIS中出现错误:处理程序“PageHandlerFactory-Integrated”在其模块列表中有一个错误模块“ManagedPipelineHandler” http:// ...

  8. C语言中的三字母词

    C语言中的三字母词(trigraph) 在ANSI C标准中,定义了9个三字母词(trigraph),三字母词就是几个字符的序列,合起来表示另一个字符.三字母词使C语言环境可以在缺少一些必需字符的字符 ...

  9. 逻辑推理:在一个100条语句的列表中,第n条语句是“在这个列表中,恰有n条语句为假”,可以得出什么结论?

    <离散数学及其应用>第六版1.1练习题第43题的个人分析 题目:在一个100条语句的列表中,第n条语句是"在这个列表中,恰有n条语句为假"..........      ...

  10. Asp.Net中的三种分页方式

    Asp.Net中的三种分页方式 通常分页有3种方法,分别是asp.net自带的数据显示空间如GridView等自带的分页,第三方分页控件如aspnetpager,存储过程分页等. 第一种:使用Grid ...

随机推荐

  1. 抢先体验!超强的 Anchor Positioning 锚点定位

    本文,将向大家介绍 CSS 规范中,最新的 Anchor Positioning,翻译为锚点定位. Anchor Position 的出现,极大的丰富了 CSS 的能力,虽然语法稍显复杂,但是有了它, ...

  2. 优化 Redis 集群缓存分配:解决节点间分配不均导致内存溢出问题

    一.Redis 集群部署简介 在现代应用程序中,缓存被广泛应用以提高性能和减轻后端数据库的压力.本文将探讨面对 Redis 集群缓存分配不均问题时的解决方法. 我们的 Redis 集群部署包括 3 主 ...

  3. ArcMap用一个面要素擦除另一个面要素的部分

      本文介绍在ArcMap软件中,基于擦除("Erase")工具,对矢量面要素的部分区域加以剔除的操作.   假如我们已知这样一个研究区域,其包括了陆地与水体两个部分.   与此同 ...

  4. QA|不同模块之间的引用(导入问题)问题;|Pycharm

    结构如图,在xxu的test.py中想要导入t2包中的sayhello和word两个方法 注意:首先需要打开xxu和t2的上层目录,因为解释器是从打开的那个文件开始查找的,所以这里应该打开B01_01 ...

  5. 6.1 KMP算法搜索机器码

    KMP算法是一种高效的字符串匹配算法,它的核心思想是利用已经匹配成功的子串前缀的信息,避免重复匹配,从而达到提高匹配效率的目的.KMP算法的核心是构建模式串的前缀数组Next,Next数组的意义是:当 ...

  6. xftp 7必须更新最新版本怎么解决

    下载可以查看16进制的软件: Sublime Text 运行XFTP7 双击打开是:这样的 解决方案 用Sublime Text进行打开nslicense.dll, 打开之后查找"0f88 ...

  7. AT 下分记录

    7.30 AGC063 \(+30=1620\) B 做法假 WA 了三次,为啥总是吃了罚时才能发现问题啊 心态还是需要解决的问题.过完 B 啥都想不出来又自闭了

  8. DESTOON做中英双语言(多语言)切换版本具体详解

    第一次发原创好激动,该注意点什么? 在开发过程中用户有许多要求,比如这个多语言切换就是一个需求. 首先讲解一下DESTOON(DT)后台系统如何做这个中英.甚至多语言切换的这个功能. DT本身不自带多 ...

  9. https://www.oracle.com/au/cloud/free/

    https://www.oracle.com/au/cloud/free/ "Oracle Cloud Free "免费云在线注册关于个人应用的用户在注册和试用的过程中遇到任何问题 ...

  10. .netCore 图形验证码,非System.Drawing.Common

    netcore需要跨平台,说白点就是放在windows服务器要能用,放在linux服务器上也能用,甚至macos上. 很多时候需要使用到图形验证码,这就有问题了. 旧方案1.引入包 <Packa ...