编程笔记 html5cssjs 015 HTML列表
编程笔记 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…...
【力扣题解】P404-左叶子之和-Java题解
👨💻博客主页:花无缺 欢迎 点赞👍 收藏⭐ 留言📝 加关注✅! 本文由 花无缺 原创 收录于专栏 【力扣题解】 文章目录 【力扣题解】P404-左叶子之和-Java题解🌏题目描述💡题解🌏总结…...
elasticsearch 索引数据多了怎么办,如何调优,部署
当Elasticsearch索引的数据量增加时,可能会遇到性能瓶颈,需要进行调优。以下是一些建议和步骤,可帮助你处理数据量增加的情况: 1. 硬件升级: 增加节点数或升级硬件,包括更快的CPU、更大的内存和更快的存储…...
Spring Cloud Gateway之Predicate断言详解
目录 Predicate(断言)内置Predicate请求参数匹配请求路径匹配Header 属性匹配Cookie 匹配请求方式匹配请求 ip 地址匹配时间匹配组合匹配 Predicate(断言) 在 Spring Cloud Gateway 中,Predicate(断言&…...
JavaScript中的prototype和_proto_的关系是什么
JavaScript中的prototype和_proto_的关系是什么 __proto__ 是 JavaScript 中对象的一个内部属性,它指向该对象的原型。JavaScript 中每个对象都有一个 __proto__ 属性,通过它可以访问对象的原型。prototype 是函数对象特有的属性,每个函数都…...
机器学习(二) -- 数据预处理(3)
系列文章目录 未完待续…… 目录 前言 tips:这里只是总结,不是教程哈。本章开始会用到numpy,pandas以及matplotlib,这些就不在这讲了哈。 “***”开头的是给好奇心重的宝宝看的,其实不太重要可以跳过。 此处以下所有…...
【数学建模美赛M奖速成系列】Matplotlib绘图技巧(三)
Matplotlib绘图技巧(三) 写在前面7. 雷达图7.1 圆形雷达图7.2 多边形雷达图 8. 极坐标图 subplot9. 折线图 plot10. 灰度图 meshgrid11. 热力图11.1 自定义colormap 12. 箱线图 boxplot 写在前面 终于更新完Matplotlib绘图技巧的全部内容,有…...
手写Spring与基本原理--简易版
文章目录 手写Spring与基本原理解析简介写一个简单的Bean加载容器定义一个抽象所有类的BeanDefinition定义一个工厂存储所有的类测试 实现Bean的注册定义和获取基于Cglib实现含构造函数的类实例化策略Bean对象注入属性和依赖Bean的功能Spring.xml解析和注册Bean对象实现应用上下…...
EasyNTS端口穿透服务新版本发布 0.8.7 增加隧道流量总数记录,可以知晓设备哪个端口耗费流量了
EasyNTS上云平台可通过远程访问内网应用,包含网络桥接、云端运维、视频直播等功能,极大地解决了现场无固定IP、端口不开放、系统权限不开放等问题。平台可提供一站式上云服务,提供直播上云、设备上云、业务上云、运维上云服务,承上…...
python自动合计各部周销
下载依赖 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…...
Java内存区域与内存溢出异常
Java与C++之间有一堵由内存分配和垃圾收集技术所围成的高墙,墙外面的人想进去,墙里面的人却想出来。 2.1 概述 对于从事C、C++程序开发的开发人员来说,在内存管理领域,他们即是拥有最高权力的“皇帝”,又是从事最基础工作的劳动人民——即拥有每一个对象的“所有权”,又…...
远程网络唤醒家庭主机(openwrt设置)
远程网络唤醒家庭主机(openwrt设置) 前提: 1.配置好主板bios的网络唤醒功能(网络教程自己百度一下找) 2.电脑开启网络唤醒功能(网络教程自己百度一下找) 3.路由器通过ddns实现域名和动态IP绑定内网穿透方法汇总_不修改光猫进行内网穿透-C…...
Spring知识02
1、这边是做单元测试的 2、项目部署上线的时候需要把Test那里注解掉 3、pom.xml的坐标系,用来导出包给别人用 4、项目名称,artifactId,name属性名保持一致 5、maven中央仓库那里可以看到导包之后会随着附加的内容 6、class.getSingleName获取…...
Linux服务器搭建笔记-006:拓展/home目录容量
一、问题说明 Ubuntu服务器在使用过程中创建的新用户,每位用户会在/home目录下生成一个属于其个人的主文件夹。如果不限制各个用户的使用空间,所有的用户都会共用/home所挂载的硬盘。在这种多用户情况下,会很快的填满/home目录,导…...
元宇宙与VR虚拟现实的未来如何?
从科幻小说到商业现实 自从 Facebook年更名为 Meta 以来,关于元宇宙的热议不断,人们对虚拟世界的兴趣也重新燃起,因为尽管虚拟现实 (VR) 的概念由来已久,但该技术现在才开始真正得以应用。 定义元宇宙和虚拟现实 首先是 The Met…...
微服务事务处理:CAP 定理和最终一致性的关系
CAP 定理和最终一致性 CAP 定理和最终一致性是两个密切相关的概念,但它们在范围和细节上有所不同。以下是比较: CAP 定理 **正式陈述:**在分布式系统中,最多只能同时满足以下三个保证中的两个:一致性、可用性和分区…...
【Linux操作系统】探秘Linux奥秘:操作系统的入门与实战
🌈个人主页:Sarapines Programmer🔥 系列专栏:《操作系统实验室》🔖诗赋清音:柳垂轻絮拂人衣,心随风舞梦飞。 山川湖海皆可涉,勇者征途逐星辉。 目录 🪐1 初识Linux OS …...
Copilot概述:AI助手引领编程新纪元
前言: 随着人工智能(AI)技术的不断进步,编程领域也在逐渐迎来一场革命。GitHub Copilot,作为一款由 OpenAI 和 GitHub 合作开发的编程助手,引发了广泛的关注和讨论。本篇博客将全面概述 Copilot 的背景、功…...
最小覆盖子串(LeetCode 76)
文章目录 1.问题描述2.难度等级3.热门指数4.解题思路参考文献 1.问题描述 给你一个字符串 s 、一个字符串 t 。返回 s 中涵盖 t 所有字符的最小子串。如果 s 中不存在涵盖 t 所有字符的子串,则返回空字符串 “” 。 注意: 对于 t 中重复字符ÿ…...
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 …...
Leetcode 3576. Transform Array to All Equal Elements
Leetcode 3576. Transform Array to All Equal Elements 1. 解题思路2. 代码实现 题目链接:3576. Transform Array to All Equal Elements 1. 解题思路 这一题思路上就是分别考察一下是否能将其转化为全1或者全-1数组即可。 至于每一种情况是否可以达到…...
基于Flask实现的医疗保险欺诈识别监测模型
基于Flask实现的医疗保险欺诈识别监测模型 项目截图 项目简介 社会医疗保险是国家通过立法形式强制实施,由雇主和个人按一定比例缴纳保险费,建立社会医疗保险基金,支付雇员医疗费用的一种医疗保险制度, 它是促进社会文明和进步的…...
Objective-C常用命名规范总结
【OC】常用命名规范总结 文章目录 【OC】常用命名规范总结1.类名(Class Name)2.协议名(Protocol Name)3.方法名(Method Name)4.属性名(Property Name)5.局部变量/实例变量(Local / Instance Variables&…...
postgresql|数据库|只读用户的创建和删除(备忘)
CREATE USER read_only WITH PASSWORD 密码 -- 连接到xxx数据库 \c xxx -- 授予对xxx数据库的只读权限 GRANT CONNECT ON DATABASE xxx TO read_only; GRANT USAGE ON SCHEMA public TO read_only; GRANT SELECT ON ALL TABLES IN SCHEMA public TO read_only; GRANT EXECUTE O…...
华为OD机试-食堂供餐-二分法
import java.util.Arrays; import java.util.Scanner;public class DemoTest3 {public static void main(String[] args) {Scanner in new Scanner(System.in);// 注意 hasNext 和 hasNextLine 的区别while (in.hasNextLine()) { // 注意 while 处理多个 caseint a in.nextIn…...
Java面试专项一-准备篇
一、企业简历筛选规则 一般企业的简历筛选流程:首先由HR先筛选一部分简历后,在将简历给到对应的项目负责人后再进行下一步的操作。 HR如何筛选简历 例如:Boss直聘(招聘方平台) 直接按照条件进行筛选 例如:…...
Kafka入门-生产者
生产者 生产者发送流程: 延迟时间为0ms时,也就意味着每当有数据就会直接发送 异步发送API 异步发送和同步发送的不同在于:异步发送不需要等待结果,同步发送必须等待结果才能进行下一步发送。 普通异步发送 首先导入所需的k…...
NPOI操作EXCEL文件 ——CAD C# 二次开发
缺点:dll.版本容易加载错误。CAD加载插件时,没有加载所有类库。插件运行过程中用到某个类库,会从CAD的安装目录找,找不到就报错了。 【方案2】让CAD在加载过程中把类库加载到内存 【方案3】是发现缺少了哪个库,就用插件程序加载进…...
MySQL 部分重点知识篇
一、数据库对象 1. 主键 定义 :主键是用于唯一标识表中每一行记录的字段或字段组合。它具有唯一性和非空性特点。 作用 :确保数据的完整性,便于数据的查询和管理。 示例 :在学生信息表中,学号可以作为主键ÿ…...
如何应对敏捷转型中的团队阻力
应对敏捷转型中的团队阻力需要明确沟通敏捷转型目的、提升团队参与感、提供充分的培训与支持、逐步推进敏捷实践、建立清晰的奖励和反馈机制。其中,明确沟通敏捷转型目的尤为关键,团队成员只有清晰理解转型背后的原因和利益,才能降低对变化的…...
