H5:列表

目录


一、前言

 二、正文

1.无序列表

2.有序列表

3.自定义列表

三、结语


一、前言

在开发场景中,列表的使用十分常见,我们开始介绍关于列表的标签使用

 二、正文

列表是用来表示数据,则用于布局。

列表的最大的特点就是整齐、整洁、有序,它作为布局会更加的自由和方便

根据使用情景的不同,列表可以分为三大类:无序列表、有序列表和自定义列表。

1.无序列表

ul标签表示HTML页面中项目中的无序列表,一般会以项目符号呈现列表项,而列表项使用li标签定义

<ul><li></li><li></li>
</ul>
  • 无序列表的各个列表项之间没有顺序级别之分,都是并列的。

  • ul标签中只能嵌套li。

  • li可以容纳其他标签。

  • 无序列表会带有自己的样式属性,但在实际使用时会使用CSS设置。

2.有序列表

ol标签为有序列表的标签,会按照一定的顺序排列定义。

在HTML标签中,ol标签用于定义有序列表,列表排序以数字来显示,并且使用li标签来定义列表项。

<ol><li>列表项1</li><li>列表项2</li><li>列表项3</li>.....
</ol>
  • ol只能嵌套li标签。

  • li标签中开放所有标签。

  • 有序标签会带有自己的样式属性,但在实际使用可以用CSS。

3.自定义列表

自定义列表用于对术语和名词进行解释和描述,定义列表的列表项前没有任何项目符号。

<dl><dt>名词1</dt><dd>名词1解释1</dd><dd>名词1解释2</dd>
</dl>

dl只能包含dt和dd标签。

dt和dd个数没有限制,经常是一个dt对应多个dd

三、结语

希望对你有所帮助,找个案例尝试一下吧。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/722192.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Mysql整理-索引

MySQL中的索引是一种数据库对象,可以提高数据检索的速度,类似于书籍的目录。它们是对数据库表中一列或多列的值进行排序的数据结构,可以让数据库查询引擎快速找到所需的行。索引对于提高数据库查询的性能至关重要,特别是在处理大量数据时。 索引类型以及其特点 以下是MySQL…

CSS3新特性

简介 继CSS2之后&#xff0c;CSS3增加了很多新的特性&#xff0c;虽然W3C仍在规范中&#xff0c;但是很多新的CSS3属性已经在很多现代浏览器中得到了支持。 CSS3边框 在CSS3中&#xff0c;可以创建圆角边框&#xff0c;添加边框阴影&#xff0c;设置边框图片&#xff0c;利用…

计算机组成原理之机器:计算机系统的基本概念

计算机组成原理之机器 笔记来源&#xff1a;哈尔滨工业大学计算机组成原理&#xff08;哈工大刘宏伟&#xff09; Chapter1&#xff1a;计算机系统的基本概念 1.1 计算机系统简介 从物理构成的角度对计算机系统分层 计算机组成原理主要关注微体系结构&#xff08;Mirco-arc…

【无标题】计算机主要应用于哪些领域

科学计算&#xff08;或称为数值计算&#xff09;、数据处理&#xff08;信息管理&#xff09;、辅助工程、生产自动化、人工智能。1、科学计算&#xff08;或称为数值计算&#xff09;&#xff1a;早期的计算机主要用于科学计算。目前&#xff0c;科学计算仍然是计算机应用的一…

【原理图PCB专题】Allegro模块化移动器件报...has the LOCKED property怎么解锁?

在模块化原理图时,PCB也需要做一个模块.mdd文件。这时需要先画好图纸然后再制作模块化文件。 修改文件时会发现模块化器件报错,无法编辑模块内部器件和走线,器件和走线都被LOCKED,如下所示报错内容: Symbol "U1" Selected Cannot edit Symbol "U1". M…

鸿蒙Harmony应用开发—ArkTS声明式开发(通用属性:组件标识)

id为组件的唯一标识&#xff0c;在整个应用内唯一。本模块提供组件标识相关接口&#xff0c;可以获取指定id组件的属性&#xff0c;也提供向指定id组件发送事件的功能。 说明&#xff1a; 从API Version 8开始支持。后续版本如有新增内容&#xff0c;则采用上角标单独标记该内容…

代码随想录算法训练营第九天

28. 实现 strStr() &#xff08;本题可以跳过&#xff09; 方法&#xff1a; 方法一&#xff1a; 暴力法 i 表示最多能移动到n-m位置&#xff0c; 超过则退出循环。j表示haystack 初始位置k表示needle的初始位置如果haystack [j] needle[k]且 k<m 则 j, k; 如果 km 则返…

OJ输入问题+准备

写在之前&#xff1a; 发现题目输入是这样的&#xff1a; 我的问题&#xff1a;如何通过空格分割这些输入的字符串并分别保存&#xff01;&#xff01;&#xff08;C语言scanf好解决一点但我选择C....&#xff09; C引入了ostringstream、istringstream、stringstream这三个类…

DevOps中集成自动化测试的具体案例

在DevOps中集成自动化测试的具体案例可以从多个角度进行分析,包括金融行业、分布式系统、大型企业等不同领域的实践。以下是几个具体的案例: 金融行业的DevOps实践:在金融行业中,DevOps被广泛应用于提升软件开发和运营的效率。例如,通过解析后台接口代码日志格式,自动化生…

蓝桥杯:DNA序列修正

问题描述 在生物学中&#xff0c;DNA 序列的相似性常被用来研究物种间的亲缘关系。现在我们有两条 DNA 序列&#xff0c;每条序列由 A、C、G、T 四种字符组成&#xff0c;长度相同。但是现在我们记录的 DNA 序列存在错误&#xff0c;为了严格满足 DNA 序列的碱基互补配对即 A …

linuxOPS基础_运维概述,及其泛概念

运维岗位定义 什么是运维&#xff1f; ​ 在技术人员&#xff08;写代码的&#xff09;之间&#xff0c;一致对运维有一个开玩笑的认知&#xff1a;运维就是修电脑的、装网线的、背锅的岗位。 ​ IT运维管理是指为了保障企业IT系统及网络的可用性、安全性、稳定性&#xff0…

MongoDB聚合运算符:$dateSubtract

文章目录 语法使用时间测量时区 举例减去固定的数量根据相对日期筛选调整夏令时 $dateSubtract聚合运算符将Date()对象按指定的时间单位递减。从版本5.0开始支持。 语法 {$dateSubtract: {startDate: <Expression>,unit: <Expression>,amount: <Expression>…

SQL 注入 - 二阶注入

环境准备:构建完善的安全渗透测试环境:推荐工具、资源和下载链接_渗透测试靶机下载-CSDN博客 一、二阶注入介绍 二次注入是一种常见于Web应用程序中的安全漏洞,也被称为SQL二阶注入。相对于一次注入漏洞,二次注入更不易被察觉,但却具有同样危险的攻击潜力。简而言之,二次…

SPI总线知识总结

1 SPI的时钟极性CPOL和时钟相位CPHA的设置 1.1 SPI数据传输位数 SPI传输数据过程中总是先发送或接收高字节数据&#xff0c;每个时钟周期接收器或发送器左移一位数据。对于小于16位的数据&#xff0c;在发送前必须左对齐&#xff0c;如果接收的数据小于16位&#xff0c;则采用软…

汽车碰撞与刮伤的实用维修技术,汽车的车身修复与涂装修补教学

一、教程描述 本套汽车维修技术教程&#xff0c;大小7.44G&#xff0c;共有60个文件。 二、教程目录 01-汽车车身修复教程01-安全规则&#xff08;共3课时&#xff09; 02-汽车车身修复教程02-汽车结构&#xff08;共3课时&#xff09; 03-汽车车身修复教程03-汽车修复所使…

session\cookie

一、session 1、基本使用 会话 在整个会话周期中任何servlet或者jsp页面都可以到会话的数据 设置数据 //将登录用户的信息存入到session中 HttpSession//获得session对象HttpSession session req.getSession();session.setAttribute("loginUser", loginUser); …

为什么Spring Cloud 应用程序中,应用程序的加载配置必须写在bootstrap.yaml这个配置文件中,是在哪里规定的?

在 Spring Cloud 应用程序中&#xff0c;bootstrap.yaml&#xff08;或bootstrap.properties&#xff09;的使用并非强制性的&#xff0c;但它扮演着一个特定的角色&#xff0c;主要是因为 Spring Cloud 的设计和工作流程。 背景和设计 Spring Cloud 构建在 Spring Boot 之上…

鸿蒙 Stage模型-应用组件-配置、UIAbility

前提&#xff1a;基于官网3.1/4.0文档。参考官网文档 基于Android开发体系来进行比较和思考。&#xff08;或有偏颇&#xff0c;自行斟酌&#xff09; 一、概念 可以看到分为运行期、编译器&#xff0c;主要关注UIAbility&#xff08;类似Activity&#xff0c;UI相关&#xff0…

2024年软考-官方最新考试安排出来了,软考新调整,很重要,但也很惹人气愤

官方最新通知&#xff0c;关于2024年度计算机技术与软件专业技术资格&#xff08;水平&#xff09;考试工作计划 笔试改机考后&#xff0c;必然会迎来调整&#xff0c;但有点让人费解。 这次调整变动主要是每年考试的次数调整&#xff0c;很多改为了一年一考&#xff0c;具体…