HTML5 <li> 标签、HTML5 <legend> 标签

news2024/11/28 10:41:55

HTML5 <li> 标签

实例

HTML5 <li>标签用于表示文档中列表的项目,在下述例子中,我们分别在有序列表和无序列表中使用了<li>标签。

HTML 两个列表实例: 一个有序列表 (<ol>) 和 一个无序列表 (<ul>) :

<ol>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>

<ul>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul> 

尝试一下 »
(本页底部查看更多实例)


浏览器支持

目前多数主流浏览器支持 <li>标签。


标签定义及使用说明

<li> 标签定义列表项目。

<li> 标签可用在有序列表(<ol>)、无序列表(<ul>)和菜单列表(<menu>)中。


HTML 4.01 与 HTML5之间的差异

"type" 属性 在 HTML 4.01 已被废弃。HTML5 不支持该属性。

"value" 属性 在 HTML 4.01 已被废弃。HTML5 不支持该属性。


提示和注释

提示: 请使用 CSS 来定义列表和列表项目的类型。


属性

属性描述
type (已废弃)1
A
a
I
i
disc
square
circle
HTML5 不支持该属性。HTML 4.01 已废弃该属性。 不赞成使用。使用 CSS list-style-type 属性来代替, 规定使用哪种项目符号。
valuenumber不赞成使用。请使用样式取代它。规定列表项目的数字。


全局属性

<li> 标签支持全局属性,查看完整属性表 HTML 全局属性。


事件属性

<li> 标签支持所有 HTML 事件属性。


在线实例

一个嵌套列表
列表内的列表。

另外一个嵌套列表
更复杂的嵌套列表。

HTML5 <legend> 标签

实例

HTML5 <legend>元素是<fieldset>元素的第一个子元素,定义了<fieldset>元素的标题。

组合表单中的相关元素:

<form>
 <fieldset>
   <legend>Personalia:</legend>
   Name: <input type="text" size="30"><br>
   Email: <input type="text" size="30"><br>
   Date of birth: <input type="text" size="10">
 </fieldset>
</form>

尝试一下 »


浏览器支持

目前大多数浏览器支持 <legend> 标签。


标签定义及使用说明

<legend> 元素为 <fieldset>元素定义标题。


HTML 4.01 与 HTML5之间的差异

在 HTML 4.01中 "align" 属性已被废弃, HTML5不支持该属性。不建议使用。 请使用 CSS 来设置 <legend> 元素的对齐方式。


属性

属性描述
aligntop
bottom
left
right
HTML5 不支持。 HTML 4.01 已废弃。不建议使用。 请使用样式代替。为 fieldset 中的标题定义对齐方式。


全局属性

<legend> 标签支持全局属性,查看完整属性表 HTML全局属性。


事件属性

<legend> 标签支持所有 HTML事件属性。

 

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

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

相关文章

机器学习入门实例-加州房价预测-2(数据整理)

计算相关性 使用corr()计算standard correlation coefficient&#xff08;Pearson’s r&#xff09;。矩阵不是很方便观察&#xff0c;可以直接排序median_house_value列&#xff0c;可以看出median_house_value与median_income的相关性挺大的。 corr_matrix visual_data.cor…

pdf 批量翻译-批量翻译照片

实现英语批量翻译通常需要使用机器翻译技术和程序编程知识。 下面是一些主要步骤&#xff1a; 选择机器翻译API&#xff1a;选择一种适合你的需求的机器翻译API&#xff0c;比如Google Translate API、Microsoft Translate API或者百度翻译API等。 注册API服务&#xff1a; 注…

721 Chapter3 MVCC(设计trade-off)

MVCC核心概念 1.读写互相不阻塞对方 2.读事务可以读一致性快照 3.支持时间旅行&#xff0c;也就是读过去的快照 但是存在写倾斜的问题。Write Skew Anomaly. 所以就MVCC到达不了serizable MVCC实现 MVCC time order 就靠原子操作CAS来check是否有人在写入&#xff0c;同时…

【Docker】通过dockerfile构建Nginx镜像部署多Web应用

【Docker】Docker安装 docker打包镜像Dockerfile构建镜像编写Dockerfile脚本构建镜像前的准备执行Dockerfile脚本 构建镜像镜像导入配置nginx.conf文件Docker操作查询index.html的路径修改web1下ProjectConfig-72e0c4f7dd.json配置文件修改nginx配置文件nginx.confDockerfile构…

GIS空间数据格式简介

Gis数据存储零、前言一、基础概念二、矢量数据1、定义2、基础3、WBT/WKB4、坐标系5、Geometry6、要素 / 要素集7、存储格式8、图层三、栅格数据1、定义2、基础3、存储格式零、前言 1、首先该篇文档主要是针对刚入坑的朋友&#xff0c;如果你对gis的存储结构谙熟于心&#xff0…

【python】计算机视觉~舌象图片中舌体倾斜判别(四)

返回至系列文章导航博客 1 简介 在智能舌诊时&#xff0c;需要判断舌头的胖瘦&#xff0c;这需要舌头在图片中处于近似垂直的位置才方便判断&#xff0c;不能过于倾斜。那么如何让计算机智能地知道舌体是否倾斜呢&#xff1f;这是这篇文章讨论的重点&#xff01; 首先也是最重…

一种轻量的“虚拟机”——Windows 沙盒模式

Windows 沙盒模式Windows沙盒的好处操作步骤Windows沙盒的好处 相比虚拟机和第三方的沙盒软件&#xff0c;Windows Sandbox启用后仅占用100MB硬盘空间&#xff0c;还能与物理机安全地共享部分内存空间。简单来说就是易用、免费、不卡机&#xff01; 由于要保证沙盒内的数据不…

表面弛豫、重构以及覆盖效应

目录 1表面弛豫 2表面能的计算 3对称和非对称板块模型 4 表面重构 5表面上的吸附质 6表面覆盖效应 1表面弛豫 在上述例子中,为了建立五层原子的板块模型,将原子放置在了板块模型中。原子的位置是理想的,是 材料中的体相原子位置。在体相的 金属中,任何两个相邻原子的间…

burpsuite 插件编写基础

文章目录一、什么是扩展 / 插件&#xff1f;二、burp 的扩展三、开发步骤一、什么是扩展 / 插件&#xff1f; 关于这个话题&#xff0c;知乎有一个回答题不错&#xff0c;主要也是引用了wikipedia 插件/扩展&#xff0c;是向现有的计算机程序添加特定功能的软件组件。 主程序…

3.2.2队列的顺序存储实现

队列是一种操作受限的顺序表&#xff08;只能在队头删除&#xff0c;在队尾插入&#xff09;。 所以依旧使用静态数组的形式去存储队列。 &#xff08;1&#xff09;创建&#xff08;初始化&#xff09; 现定于&#xff08;顺序队列&#xff09;的结构体 初始化队列时&#x…

CentOS7---Nginx安装并配置虚拟主机

1、源码安装nginx&#xff0c;并提供服务脚本 源码包的获取&#xff1a;官网下载 实验环境&#xff1a;和企业环境类似&#xff0c;关闭防火墙&#xff0c;禁用selinux&#xff0c;使用静态IP地址 安装步骤&#xff1a; 步骤一&#xff1a;安装Nginx所需的pcre库 [rootnode01 ~…

openvpn (用户名密码模式)

目录 一、介绍 1、定义 2、原理 3、加密和身份验证 二、在centos 7.5上搭建openvpn 1、安装openvpn 和easy-rsa&#xff08;该包用来制作ca证书&#xff09; 2、配置/etc/openvpn/ 目录 3、创建服务端证书及key 4、创建客户端证书 5、把服务器端必要文件放到etc/openvpn/ 目录下…

LeetCode 785. Is Graph Bipartite【DFS,二分图】中等

本文属于「征服LeetCode」系列文章之一&#xff0c;这一系列正式开始于2021/08/12。由于LeetCode上部分题目有锁&#xff0c;本系列将至少持续到刷完所有无锁题之日为止&#xff1b;由于LeetCode还在不断地创建新题&#xff0c;本系列的终止日期可能是永远。在这一系列刷题文章…

[牛客101] 二叉树的层序遍历

这道题会考察很多知识点,这里专门进行详解 文章目录题目描述二. 题目分析完整代码题目描述 二. 题目分析 首先,我们会想到存储方式为二维数组.数组每一行存储一层的结点.怎么确定每一行要存储几个结点呢.由于节点与节点之间存在父子关系,所以,在存储某一层的结点时,就可以通过…

使用Process Explorer和Dependency Walker排查C++程序中dll库动态加载失败问题

目录 1、exe主程序启动时的库加载流程说明 2、加载dll库两种方式 2.1、dll库的隐式引用 2.2、dll库的动态加载 3、本案例中的问题描述 4、使用Process Explorer和Dependency Walker分析dll库加载失败的原因 4.1、Process Explorer工具介绍 4.2、使用Process Explorer工…

Mysql日志系统-mysql serve层

Mysql日志系统-服务层的日志 mysql给我们提供了很多有用的日志有mysql服务层提供的&#xff0c;有innodb引擎层提供的&#xff0c;下表是mysql服务层给我们提供的&#xff1a; 日志类型写入日志的信息二进制日志记录了对MySQL数据库执行更改的所有操作慢查询日志记录所有执行…

【JavaScript】2.JavaScript函数

JavaScript 函数 1. 函数的概念 函数&#xff1a;就是封装了一段可被重复调用执行的代码块 通过此代码块可以实现大量代码的重复使用 2. 函数的使用 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta na…

定点乘法器优化---华为杯

一. 简介 在本篇文章开始之前&#xff0c;先对上篇文章中的一个错误进行指正一下。在部分积生成的时候&#xff0c;需要计算-2A和2A的值&#xff0c;我的做法就是直接左移了一位&#xff0c;这样就会有一个问题&#xff0c;符号位被移掉了&#xff0c;为什么我的计算结果还是对…

Java Stream API 操作完全攻略:让你的代码更加出色 (三)

前言 Java Stream 是一种强大的数据处理工具&#xff0c;可以帮助开发人员快速高效地处理和转换数据流。使用 Stream 操作可以大大简化代码&#xff0c;使其更具可读性和可维护性&#xff0c;从而提高开发效率。本文将为您介绍 Java Stream 操作的所有方面&#xff0c;包括 gro…

c++中的类继承

面向对象编程的主要目的是之一是提供可重用的代码。开发新项目&#xff0c;尤其是当项目十分庞大时&#xff0c;重用经过测试的代码比重新编写代码要好得多。使用已有的代码可以节省时间&#xff0c;由于已有的代码已被使用和测试过&#xff0c;因此有助于避免在程序中引入错误…