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

编程笔记 html5cssjs 015 HTML列表

news 2025/7/8 2:42:43

编程笔记 html5&css&js 015 HTML列表

一、有序列表
- 例1：
- 例2：
二、无序列表
- 例1：
- 例2：

列表是一种特定文字格式，很常用。
HTML 列表。HTML 支持有序、无序和定义列表。

一、有序列表

例1：

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>有序列表</title> 
</head>
<body>
<ol><li>Coffee</li><li>Tea</li><li>Milk</li>
</ol>
<ol start="50"><li>Coffee</li><li>Tea</li><li>Milk</li>
</ol>
</body>
</html>

例2：

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>有序列表</title> 
</head>
<body>
<h4>编号列表：</h4>
<ol><li>Apples</li><li>Bananas</li><li>Lemons</li><li>Oranges</li>
</ol>  <h4>大写字母列表：</h4>
<ol type="A"><li>Apples</li><li>Bananas</li><li>Lemons</li><li>Oranges</li>
</ol>  <h4>小写字母列表：</h4>
<ol type="a"><li>Apples</li><li>Bananas</li><li>Lemons</li><li>Oranges</li>
</ol>  <h4>罗马数字列表：</h4>
<ol type="I"><li>Apples</li><li>Bananas</li><li>Lemons</li><li>Oranges</li>
</ol>  <h4>小写罗马数字列表：</h4>
<ol type="i"><li>Apples</li><li>Bananas</li><li>Lemons</li><li>Oranges</li>
</ol>  </body>
</html>

二、无序列表

例1：

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>无序列表</title> 
</head> 
<body>
<h4>无序列表:</h4>
<ul><li>Coffee</li><li>Tea</li><li>Milk</li>
</ul>
</body>
</html>

例2：

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>无序列表</title> 
</head>
<body>
<p><b>注意：</b> 在 HTML 4中 ul 属性已废弃，HTML5 已不支持该属性，因此我们使用 CSS 代替来定义不同类型的无序列表如下：</p>
<h4>圆点列表：</h4>
<ul style="list-style-type:disc"><li>Apples</li><li>Bananas</li><li>Lemons</li><li>Oranges</li>
</ul>  
<h4>圆圈列表：</h4>
<ul style="list-style-type:circle"><li>Apples</li><li>Bananas</li><li>Lemons</li><li>Oranges</li>
</ul>  
<h4>正方形列表：</h4>
<ul style="list-style-type:square"><li>Apples</li><li>Bananas</li><li>Lemons</li><li>Oranges</li>
</ul>
</body>
</html>

编程笔记 html5cssjs 015 HTML列表

编程笔记 html5&css&js 015 HTML列表一、有序列表例1：例2： 二、无序列表例1：例2： 列表是一种特定文字格式，很常用。 HTML 列表。HTML 支持有序、无序和定义列表。一、有序列表例1： <!DOCTY…...

编程日记 2023/12/30 21:34:58

【力扣题解】P404-左叶子之和-Java题解

👨‍💻博客主页：花无缺欢迎点赞👍 收藏⭐ 留言📝 加关注✅! 本文由花无缺原创收录于专栏【力扣题解】文章目录【力扣题解】P404-左叶子之和-Java题解🌏题目描述💡题解🌏总结…...

编程日记 2023/12/30 21:22:45

elasticsearch 索引数据多了怎么办，如何调优，部署

当Elasticsearch索引的数据量增加时，可能会遇到性能瓶颈，需要进行调优。以下是一些建议和步骤，可帮助你处理数据量增加的情况： 1. 硬件升级： 增加节点数或升级硬件，包括更快的CPU、更大的内存和更快的存储…...

编程日记 2023/12/30 21:20:44

Spring Cloud Gateway之Predicate断言详解

目录 Predicate（断言）内置Predicate请求参数匹配请求路径匹配Header 属性匹配Cookie 匹配请求方式匹配请求 ip 地址匹配时间匹配组合匹配 Predicate（断言） 在 Spring Cloud Gateway 中，Predicate（断言&…...

编程日记 2023/12/30 21:16:40

JavaScript中的prototype和_proto_的关系是什么

JavaScript中的prototype和_proto_的关系是什么 __proto__ 是 JavaScript 中对象的一个内部属性，它指向该对象的原型。JavaScript 中每个对象都有一个 __proto__ 属性，通过它可以访问对象的原型。prototype 是函数对象特有的属性，每个函数都…...

编程日记 2023/12/30 21:12:37

机器学习（二） -- 数据预处理（3）

系列文章目录未完待续…… 目录前言 tips：这里只是总结，不是教程哈。本章开始会用到numpy，pandas以及matplotlib，这些就不在这讲了哈。 “***”开头的是给好奇心重的宝宝看的，其实不太重要可以跳过。此处以下所有…...

编程日记 2023/12/30 21:11:35

【数学建模美赛M奖速成系列】Matplotlib绘图技巧（三）

Matplotlib绘图技巧（三） 写在前面7. 雷达图7.1 圆形雷达图7.2 多边形雷达图 8. 极坐标图 subplot9. 折线图 plot10. 灰度图 meshgrid11. 热力图11.1 自定义colormap 12. 箱线图 boxplot 写在前面终于更新完Matplotlib绘图技巧的全部内容，有…...

编程日记 2023/12/30 21:08:32

手写Spring与基本原理--简易版

文章目录手写Spring与基本原理解析简介写一个简单的Bean加载容器定义一个抽象所有类的BeanDefinition定义一个工厂存储所有的类测试实现Bean的注册定义和获取基于Cglib实现含构造函数的类实例化策略Bean对象注入属性和依赖Bean的功能Spring.xml解析和注册Bean对象实现应用上下…...

编程日记 2023/12/30 21:05:29

EasyNTS端口穿透服务新版本发布 0.8.7 增加隧道流量总数记录，可以知晓设备哪个端口耗费流量了

EasyNTS上云平台可通过远程访问内网应用，包含网络桥接、云端运维、视频直播等功能，极大地解决了现场无固定IP、端口不开放、系统权限不开放等问题。平台可提供一站式上云服务，提供直播上云、设备上云、业务上云、运维上云服务，承上…...

编程日记 2023/12/30 21:00:24

下载依赖 pip install openpyxl -i https://pypi.doubanio.com/simplepip install pandas -i https://pypi.doubanio.com/simple引入依赖 from openpyxl import load_workbook from openpyxl import styles from openpyxl.styles import * import pandas as pd import string…...

编程日记 2023/12/30 20:59:22

Java内存区域与内存溢出异常

Java与C++之间有一堵由内存分配和垃圾收集技术所围成的高墙，墙外面的人想进去，墙里面的人却想出来。 2.1 概述对于从事C、C++程序开发的开发人员来说，在内存管理领域，他们即是拥有最高权力的“皇帝”，又是从事最基础工作的劳动人民——即拥有每一个对象的“所有权”，又…...

编程日记 2023/12/30 20:55:19

远程网络唤醒家庭主机（openwrt设置）

远程网络唤醒家庭主机（openwrt设置） 前提： 1.配置好主板bios的网络唤醒功能(网络教程自己百度一下找) 2.电脑开启网络唤醒功能(网络教程自己百度一下找) 3.路由器通过ddns实现域名和动态IP绑定内网穿透方法汇总_不修改光猫进行内网穿透-C…...

编程日记 2023/12/30 20:54:18

Spring知识02

1、这边是做单元测试的 2、项目部署上线的时候需要把Test那里注解掉 3、pom.xml的坐标系，用来导出包给别人用 4、项目名称，artifactId，name属性名保持一致 5、maven中央仓库那里可以看到导包之后会随着附加的内容 6、class.getSingleName获取…...

编程日记 2023/12/30 20:53:17

Linux服务器搭建笔记-006：拓展/home目录容量

一、问题说明 Ubuntu服务器在使用过程中创建的新用户，每位用户会在/home目录下生成一个属于其个人的主文件夹。如果不限制各个用户的使用空间，所有的用户都会共用/home所挂载的硬盘。在这种多用户情况下，会很快的填满/home目录，导…...

编程日记 2023/12/30 20:52:16

元宇宙与VR虚拟现实的未来如何？

从科幻小说到商业现实自从 Facebook年更名为 Meta 以来，关于元宇宙的热议不断，人们对虚拟世界的兴趣也重新燃起，因为尽管虚拟现实 (VR) 的概念由来已久，但该技术现在才开始真正得以应用。定义元宇宙和虚拟现实首先是 The Met…...

编程日记 2023/12/30 20:45:10

微服务事务处理：CAP 定理和最终一致性的关系

CAP 定理和最终一致性 CAP 定理和最终一致性是两个密切相关的概念，但它们在范围和细节上有所不同。以下是比较： CAP 定理 **正式陈述：**在分布式系统中，最多只能同时满足以下三个保证中的两个：一致性、可用性和分区…...

编程日记 2023/12/30 20:42:07

【Linux操作系统】探秘Linux奥秘：操作系统的入门与实战

🌈个人主页：Sarapines Programmer🔥 系列专栏：《操作系统实验室》🔖诗赋清音：柳垂轻絮拂人衣，心随风舞梦飞。山川湖海皆可涉，勇者征途逐星辉。目录 🪐1 初识Linux OS …...

编程日记 2023/12/30 20:41:06

Copilot概述：AI助手引领编程新纪元

前言： 随着人工智能（AI）技术的不断进步，编程领域也在逐渐迎来一场革命。GitHub Copilot，作为一款由 OpenAI 和 GitHub 合作开发的编程助手，引发了广泛的关注和讨论。本篇博客将全面概述 Copilot 的背景、功…...

编程日记 2023/12/30 20:40:05

最小覆盖子串（LeetCode 76）

文章目录 1.问题描述2.难度等级3.热门指数4.解题思路参考文献 1.问题描述给你一个字符串 s 、一个字符串 t 。返回 s 中涵盖 t 所有字符的最小子串。如果 s 中不存在涵盖 t 所有字符的子串，则返回空字符串 “” 。注意： 对于 t 中重复字符&#xff…...

编程日记 2023/12/30 20:39:05

Windows Sockets 2 笔记

文章目录一、Winsock简介二、Windows中Winsock对网络协议支持的情况三、使用Winsock3.1 关于服务器和客户端3.2 创建基本Winsock应用程序3.3 初始化Winscok3.3.1 初始化步骤3.3.2 初始化的核心代码3.3.3 WSAStartup函数的协调3.3.4 WSACleanup函数3.3.5 初始化的完整代码 3.4 …...

编程日记 2023/12/30 20:38:04