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

HTML(五)列表详解

在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>…...

SparkSQL介绍及使用

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

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

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

C++基础补充(03)C++20 的 std::format 函数

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

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

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

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

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

操作系统(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…...

鸿蒙--知乎评论

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

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

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

小程序该如何上架

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

XMOJ3065 旅游线路

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

量化之一:均值回归策略

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

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

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

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

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

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

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

计算机网络(十一) —— 数据链路层

目录 一&#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转…...

使用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…...

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

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

类与对象 中(剩余部分) 以及 日历

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

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

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

【大模型RAG】拍照搜题技术架构速览:三层管道、两级检索、兜底大模型

摘要 拍照搜题系统采用“三层管道&#xff08;多模态 OCR → 语义检索 → 答案渲染&#xff09;、两级检索&#xff08;倒排 BM25 向量 HNSW&#xff09;并以大语言模型兜底”的整体框架&#xff1a; 多模态 OCR 层 将题目图片经过超分、去噪、倾斜校正后&#xff0c;分别用…...

使用van-uploader 的UI组件,结合vue2如何实现图片上传组件的封装

以下是基于 vant-ui&#xff08;适配 Vue2 版本 &#xff09;实现截图中照片上传预览、删除功能&#xff0c;并封装成可复用组件的完整代码&#xff0c;包含样式和逻辑实现&#xff0c;可直接在 Vue2 项目中使用&#xff1a; 1. 封装的图片上传组件 ImageUploader.vue <te…...

TRS收益互换:跨境资本流动的金融创新工具与系统化解决方案

一、TRS收益互换的本质与业务逻辑 &#xff08;一&#xff09;概念解析 TRS&#xff08;Total Return Swap&#xff09;收益互换是一种金融衍生工具&#xff0c;指交易双方约定在未来一定期限内&#xff0c;基于特定资产或指数的表现进行现金流交换的协议。其核心特征包括&am…...

Java入门学习详细版(一)

大家好&#xff0c;Java 学习是一个系统学习的过程&#xff0c;核心原则就是“理论 实践 坚持”&#xff0c;并且需循序渐进&#xff0c;不可过于着急&#xff0c;本篇文章推出的这份详细入门学习资料将带大家从零基础开始&#xff0c;逐步掌握 Java 的核心概念和编程技能。 …...

【HarmonyOS 5 开发速记】如何获取用户信息(头像/昵称/手机号)

1.获取 authorizationCode&#xff1a; 2.利用 authorizationCode 获取 accessToken&#xff1a;文档中心 3.获取手机&#xff1a;文档中心 4.获取昵称头像&#xff1a;文档中心 首先创建 request 若要获取手机号&#xff0c;scope必填 phone&#xff0c;permissions 必填 …...

什么是Ansible Jinja2

理解 Ansible Jinja2 模板 Ansible 是一款功能强大的开源自动化工具&#xff0c;可让您无缝地管理和配置系统。Ansible 的一大亮点是它使用 Jinja2 模板&#xff0c;允许您根据变量数据动态生成文件、配置设置和脚本。本文将向您介绍 Ansible 中的 Jinja2 模板&#xff0c;并通…...

C++使用 new 来创建动态数组

问题&#xff1a; 不能使用变量定义数组大小 原因&#xff1a; 这是因为数组在内存中是连续存储的&#xff0c;编译器需要在编译阶段就确定数组的大小&#xff0c;以便正确地分配内存空间。如果允许使用变量来定义数组的大小&#xff0c;那么编译器就无法在编译时确定数组的大…...

HDFS分布式存储 zookeeper

hadoop介绍 狭义上hadoop是指apache的一款开源软件 用java语言实现开源框架&#xff0c;允许使用简单的变成模型跨计算机对大型集群进行分布式处理&#xff08;1.海量的数据存储 2.海量数据的计算&#xff09;Hadoop核心组件 hdfs&#xff08;分布式文件存储系统&#xff09;&a…...

Python+ZeroMQ实战:智能车辆状态监控与模拟模式自动切换

目录 关键点 技术实现1 技术实现2 摘要&#xff1a; 本文将介绍如何利用Python和ZeroMQ消息队列构建一个智能车辆状态监控系统。系统能够根据时间策略自动切换驾驶模式&#xff08;自动驾驶、人工驾驶、远程驾驶、主动安全&#xff09;&#xff0c;并通过实时消息推送更新车…...

uniapp 开发ios, xcode 提交app store connect 和 testflight内测

uniapp 中配置 配置manifest 文档&#xff1a;manifest.json 应用配置 | uni-app官网 hbuilderx中本地打包 下载IOS最新SDK 开发环境 | uni小程序SDK hbulderx 版本号&#xff1a;4.66 对应的sdk版本 4.66 两者必须一致 本地打包的资源导入到SDK 导入资源 | uni小程序SDK …...