当前位置： 首页 > news >正文

HTML（五）列表详解

news 2025/8/15 11:22:09

在HTML中，列表可以分为两种，一种为有序列表。另一种为无序列表

今天就来详细讲解一下这两种列表如何实现，效果如何

1.有序列表

有序列表的标准格式如下：

   <ol><li>列表项一</li><li>列表项二</li></ol>

这里的列表项可以随意更改内容，使用示例如下：

<!DOCTYPE html>
<html><head><meta charset="UTF-8" /><title>title</title>
</head><body><ol><li>吃饭</li><li>睡觉</li></ol></body>
</html>

效果图如下：

2.有序列表更改前导符

什么是前导符？

前导符就是我们在使用列表打出文字前的小标题，如上图中的 1.    2. 这些都是前导符

前导符的标准语言使用如下：

 <ol type="前导符"><li>列表项一</li><li>列表项二</li></ol>

 这里的前导符有五种，如下图：

 接下来是实际代码演示+效果

<!DOCTYPE html>
<html><head><meta charset="UTF-8" /><title>title</title>
</head><body><ol type="a"><li>列表项一</li><li>列表项二</li></ol><ol type="A"><li>列表项一</li><li>列表项二</li></ol><ol type="1"><li>列表项一</li><li>列表项二</li></ol><ol type="i"><li>列表项一</li><li>列表项二</li></ol><ol type="I"><li>列表项一</li><li>列表项二</li></ol>
</body>
</html>

 3.无序列表

在HTML中另外一种列表被称作无序列表，无序列表与有序列表极其相似，只有微小的差距

无序列表标准格式如下：

    <ul><li>列表项一</li><li>列表项儿</li></ul>

无序列表使用及效果如下：

<!DOCTYPE html>
<html><head><meta charset="UTF-8" /><title>title</title>
</head><body><ul><li>吃饭</li><li>睡觉</li></ul></body>
</html>

 4.无序列表更改前导符

这里不做演示了，与有序列表使用方法相同

相关文章：

HTML（五）列表详解

在HTML中&#xff0c;列表可以分为两种&#xff0c;一种为有序列表。另一种为无序列表 今天就来详细讲解一下这两种列表如何实现&#xff0c;效果如何 1.有序列表 有序列表的标准格式如下&#xff1a; <ol><li>列表项一</li><li>列表项二</li>…...

编程日记 2024/10/13 13:28:04

SparkSQL介绍及使用

SparkSQL介绍及使用 一、什么是SparkSQL&#xff08;了解&#xff09; spark开发时可以使用rdd进行开发&#xff0c;spark还提供saprksql工具&#xff0c;将数据转为结构化数据进行操作 1-1 介绍 官网&#xff1a;https://spark.apache.org/sql/ Spark SQL是 Apache Spark 用于…...

编程日记 2024/10/13 13:25:01

【聚星文社】3.2版一键推文工具更新啦

【聚星文社】3.2版一键推文工具更新啦。调试了好几个通宵就是为了效果和质量。 旧版尽早更新新版&#xff0c;从此告别手搓&#xff01; 工具入口https://iimenvrieak.feishu.cn/docx/ZhRNdEWT6oGdCwxdhOPcdds7nof...

编程日记 2024/10/13 13:22:59

C++基础补充（03）C++20 的 std::format 函数

文章目录 1. 使用C20 std::format2. 基本用法3. 格式说明 1. 使用C20 std::format 需要将VisualStudio默认的标准修改为C20 菜单“项目”-“项目属性”&#xff0c;打开如下对话框 代码中加入头文件 2. 基本用法 通过占位符{}制定格式化的位置&#xff0c;后面传入变量 #…...

编程日记 2024/10/13 13:21:56

[论文笔记]DAPR: A Benchmark on Document-Aware Passage Retrieval

引言 今天带来论文DAPR: A Benchmark on Document-Aware Passage Retrieval的笔记。 本文提出了一个基准&#xff1a;文档感知段落检索(Document-Aware Passage Retrieval,DAPR)以及介绍了一些上下文段落表示的方法。 为了简单&#xff0c;下文中以翻译的口吻记录&#xff0c…...

编程日记 2024/10/13 13:20:55

Spring Boot知识管理：智能搜索与分析

3系统分析 3.1可行性分析 通过对本知识管理系统实行的目的初步调查和分析&#xff0c;提出可行性方案并对其一一进行论证。我们在这里主要从技术可行性、经济可行性、操作可行性等方面进行分析。 3.1.1技术可行性 本知识管理系统采用JAVA作为开发语言&#xff0c;Spring Boot框…...

编程日记 2024/10/13 13:19:54

操作系统(2) (进程调度/进程调度器类型/三种进程调度/调度算法)

目录 1. 介绍进程调度&#xff08;Introduction to Process Scheduling&#xff09; 2. 优先级调度&#xff08;Priority Scheduling&#xff09; 3. CPU 利用率&#xff08;CPU Utilization&#xff09; 4. 吞吐量&#xff08;Throughput&#xff09; 5. 周转时间&#xf…...

编程日记 2024/10/13 13:18:50

鸿蒙--知乎评论

这里我们将采用组件化的思想进行开发 在开发中默认展示的是首页也就是 pages/Index.ets页面 这里存放的是所有页面的配置文件，类似与uniapp中的pages.json 如果我们此时要更改默认显示Zh...

编程日记 2024/10/13 13:16:48

2024 - 两台CentOS服务器上的1000个Docker容器（每台500个）之间实现UDP通信(C语言版本)

两台CentOS服务器上的1000个Docker容器&#xff08;每台500个&#xff09;之间实现UDP通信(C语言版本) 给女朋友对象写得&#xff0c;她不会&#xff0c;我就写了一个 为了帮助您在两台CentOS服务器上的1000个Docker容器&#xff08;每台500个&#xff09;之间实现UDP通信&…...

编程日记 2024/10/13 13:15:48

小程序该如何上架

小程序的上架流程通常包括准备工作、代码审核、人工审核以及上线发布等关键步骤。以下是一个详细的小程序上架指南&#xff1a; 一、准备工作 注册开发者账号&#xff1a; 在微信小程序平台或支付宝开放平台等相应的小程序发布平台上注册开发者账号。 开发小程序&#xff1a; …...

编程日记 2024/10/13 13:12:44

XMOJ3065 旅游线路

10分钟没啥思路就去看题解了&#xff0c;结果发现很蠢。 题目大意 有一条河&#xff0c;河的东侧和西侧分别有 n , m n,m n,m 个景点&#xff0c;每个景点有个权值。有 k k k 条船&#xff0c;每条船连接东侧和西侧的一个景点。定义一个旅游线路是通过船连接起来的景点序列…...

编程日记 2024/10/13 13:10:42

量化之一：均值回归策略

文章目录 均值回归策略理论基础数学公式 关键指标简单移动平均线&#xff08;SMA&#xff09;标准差Z-Score 交易信号实际应用优缺点分析优点缺点 结论 实践backtrader参数&#xff1a;正常情况&#xff1a;异常情况&#xff1a; 均值回归策略 均值回归&#xff08;Mean Rever…...

编程日记 2024/10/13 13:08:40

NVIDIA Bluefield DPU上的启动流程4个阶段分别是什么？作用是什么？

文章目录 Bluefield上的硬件介绍启动流程启动流程：eMMC中的两个存储分区：ATF介绍ATF启动的四个阶段：四个主要步骤：各个阶段依赖的启动文件一次烧录fw失败后的信息看启动流程综述Bluefield上的硬件介绍 本文以Bluefield2为例，可以看到RSHIM实际上是Boot相关的集合。也能看…...

编程日记 2024/10/13 13:07:37

最优美公式-欧拉公式，轻松理解版

Alan Becker创作的火柴人大战数学的打斗视频&#xff0c;风靡一时&#xff0c;并在B站荣耀斩获了“金知奖”。下面是网友对此视频的部分评价截图。 视频原址&#xff1a;火柴人 vs 数学&#xff0c;后续又一口气看完了“火柴人vs 几何”与“火柴人vs 物理”&#xff0c;通过火柴…...

编程日记 2024/10/13 13:02:32

【力扣 | SQL题 | 每日3题】力扣1107，1112， 1077

今天三道mid题都可以用窗口函数轻松秒杀。 1. 力扣1107&#xff1a;每日新用户统计 1.1 题目&#xff1a; Traffic 表&#xff1a; ------------------------ | Column Name | Type | ------------------------ | user_id | int | | activity | enum …...

编程日记 2024/10/13 13:01:31

计算机网络（十一） —— 数据链路层

目录 一&#xff0c;关于数据链路层 二&#xff0c;以太网协议 2.1 局域网 2.2 Mac地址 2.3 Mac帧报头 2.4 MTU 三&#xff0c;ARP协议 3.1 ARP是什么 3.2 ARP原理 3.3 ARP报头 3.4 模拟ARP过程 3.5 ARP周边问题 四&#xff0c;NAT技术 4.1 NAT技术背景 4.2 NAT转…...

编程日记 2024/10/13 13:00:30

使用PyTorch从0实现Fashion-MNIST数据集分类

完整代码&#xff1a; from d2l import torch as d2l import torch from torchvision import transforms from torchvision import datasets from torch.utils.data import DataLoader import matplotlib.pyplot as plt from IPython import displaydef get_fashion_mnist_la…...

编程日记 2024/10/13 12:59:27

Java数组的值拷贝和地址拷贝

在Java中&#xff0c;数组的值拷贝和地址拷贝是两种不同的操作。 值拷贝是指将一个数组的值复制到另一个新的数组中。这意味着新数组和原数组独立存在&#xff0c;修改其中一个数组不会影响另一个数组。Java中的数组是对象&#xff0c;所以通过值拷贝操作实际上是复制了数组对…...

编程日记 2024/10/13 12:57:25

类与对象 中（剩余部分） 以及 日历

运算符重载 • 当运算符被⽤于类类型的对象时&#xff0c;C语⾔允许我们通过运算符重载的形式指定新的含义。C规定类类型对象使⽤运算符时&#xff0c;必须转换成调⽤对应运算符重载&#xff0c;若没有对应的运算符重载&#xff0c;则会编译报错。 • 运算符重载是具有特名字的…...

编程日记 2024/10/13 12:54:19

iOS 14 自定义画中画悬浮窗 Custom AVPictureInPictureController 实现方案

iOS 14&#xff0c;基于 AVPictureInPictureController&#xff0c;实现自定义画中画&#xff0c;涵盖所有功能与难点。 市面上的各种悬浮钟和提词器的原理都是基于此。 Demo源码在文末。 使用 iOS 画中画的要求&#xff1a; 真机&#xff0c;不能使用模拟器&#xff1b;iO…...

编程日记 2024/10/13 12:53:18

龙虎榜——20250610

上证指数放量收阴线&#xff0c;个股多数下跌&#xff0c;盘中受消息影响大幅波动。 深证指数放量收阴线形成顶分型&#xff0c;指数短线有调整的需求&#xff0c;大概需要一两天。 2025年6月10日龙虎榜行业方向分析 1. 金融科技 代表标的&#xff1a;御银股份、雄帝科技 驱动…...

编程新知 2025/8/14 21:19:08

深度学习在微纳光子学中的应用

深度学习在微纳光子学中的主要应用方向 深度学习与微纳光子学的结合主要集中在以下几个方向&#xff1a; 逆向设计 通过神经网络快速预测微纳结构的光学响应&#xff0c;替代传统耗时的数值模拟方法。例如设计超表面、光子晶体等结构。 特征提取与优化 从复杂的光学数据中自…...

编程新知 2025/8/14 21:18:33

五年级数学知识边界总结思考-下册

目录 一、背景二、过程1.观察物体小学五年级下册“观察物体”知识点详解&#xff1a;由来、作用与意义**一、知识点核心内容****二、知识点的由来&#xff1a;从生活实践到数学抽象****三、知识的作用&#xff1a;解决实际问题的工具****四、学习的意义&#xff1a;培养核心素养…...

编程新知 2025/6/20 13:47:44

1.3 VSCode安装与环境配置

进入网址Visual Studio Code - Code Editing. Redefined下载.deb文件&#xff0c;然后打开终端&#xff0c;进入下载文件夹&#xff0c;键入命令 sudo dpkg -i code_1.100.3-1748872405_amd64.deb 在终端键入命令code即启动vscode 需要安装插件列表 1.Chinese简化 2.ros …...

编程新知 2025/8/11 20:07:23

srs linux

下载编译运行 git clone https:///ossrs/srs.git ./configure --h265on make 编译完成后即可启动SRS # 启动 ./objs/srs -c conf/srs.conf # 查看日志 tail -n 30 -f ./objs/srs.log 开放端口 默认RTMP接收推流端口是1935&#xff0c;SRS管理页面端口是8080&#xff0c;可…...

编程新知 2025/8/13 14:51:57

Axios请求超时重发机制

Axios 超时重新请求实现方案 在 Axios 中实现超时重新请求可以通过以下几种方式&#xff1a; 1. 使用拦截器实现自动重试 import axios from axios;// 创建axios实例 const instance axios.create();// 设置超时时间 instance.defaults.timeout 5000;// 最大重试次数 cons…...

编程新知 2025/7/21 22:01:13

CMake 从 GitHub 下载第三方库并使用

有时我们希望直接使用 GitHub 上的开源库，而不想手动下载、编译和安装。 可以利用 CMake 提供的 FetchContent 模块来实现自动下载、构建和链接第三方库。 FetchContent 命令官方文档✅ 示例代码 我们将以 fmt 这个流行的格式化库为例，演示如何： 使用 FetchContent 从 GitH…...

编程新知 2025/8/13 21:55:06

python报错No module named ‘tensorflow.keras‘

是由于不同版本的tensorflow下的keras所在的路径不同&#xff0c;结合所安装的tensorflow的目录结构修改from语句即可。 原语句&#xff1a; from tensorflow.keras.layers import Conv1D, MaxPooling1D, LSTM, Dense 修改后&#xff1a; from tensorflow.python.keras.lay…...

编程新知 2025/7/31 1:40:46

Vue3中的computer和watch

computed的写法 在页面中 <div>{{ calcNumber }}</div>script中 写法1 常用 import { computed, ref } from vue; let price ref(100);const priceAdd () > { //函数方法 price 1price.value ; }//计算属性 let calcNumber computed(() > {return ${p…...

编程新知 2025/7/6 5:23:51

Appium下载安装配置保姆教程（图文详解）

目录 一、Appium软件介绍 1.特点 2.工作原理 3.应用场景 二、环境准备 安装 Node.js 安装 Appium 安装 JDK 安装 Android SDK 安装Python及依赖包 三、安装教程 1.Node.js安装 1.1.下载Node 1.2.安装程序 1.3.配置npm仓储和缓存 1.4. 配置环境 1.5.测试Node.j…...

编程新知 2025/8/6 3:11:10