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

HTML2.1列表标签

 

列表标签种类

无序列表 有序列表 自定义列表

使用场景:在列表中按照行展示关联性内容。

特点:按照行的形式,整齐显示内容。

一、无序列表

标签名说明
ul无序列表整体,用于包裹li标签
li表示无序列表的每一项,用于包含每一项内容

显示特点:列表每一项前默认显示圆点标识。

注:ul中只允许包含li标签。li标签中可以包含任何内容

代码: 

网页效果展示:

 

二、有序列表 

使用场景:一组有顺序之分的列表。

有序列表标签组成
标签名说明
ol有序整体,包裹li标签
li有序列表每一项,包含每一行

 显示特点:列表每一项前默认显示序号标识。

注:ol标签中只允许包含li标签。li标签可以包含任意内容

代码(注意区分与ul的区别):

 

网页效果展示: 

 

三、自定义列表

使用场景:网页底部导航。

例如京东网页底部导航:

 

自定义标签组成
标签名说明
dl自定义标签整体,包裹dt/dd标签
dt自定义列表主题
dd自定义列表针对主题的每一项内容

 显示特点:dd前默认显示缩进

注:dl标签只允许包含dt/dd标签。dt/dd标签可以包含任意内容

代码:

 

 网页效果展示:

 

相关文章:

HTML2.1列表标签

列表标签种类 无序列表 有序列表 自定义列表 使用场景:在列表中按照行展示关联性内容。 特点:按照行的形式,整齐显示内容。 一、无序列表 标签名说明ul无序列表整体,用于包裹li标签li表示无序列表的每一项,用于包…...

在 Flutter 多人视频通话中实现虚拟背景、美颜与空间音效

前言 在之前的「基于声网 Flutter SDK 实现多人视频通话」里,我们通过 Flutter 声网 SDK 完美实现了跨平台和多人视频通话的效果,那么本篇我们将在之前例子的基础上进阶介绍一些常用的特效功能,包括虚拟背景、色彩增强、空间音频、基础变声…...

Ambari-web 架构

Ambari-web 使用的前端 Embar.js MVC 框架实现,Embar.js 是一个 TodoMVC 框架,涵盖了单页面应用(single page application)几乎所有的行为 Nodejs 是一个基于 Chrome JavaScript 运行时建立的一个平台,用来方便的搭建…...

对接百思买Best Buy EDI 的注意事项

在此前的文章:《Best Buy Drop Ship(Commerce hub) EDI业务测试常见报错及解决》中,我们介绍了在业务测试过程中遇到的常见报错及解决方案,以下在此基础上进行补充。 数据未能成功发送给Best Buy可能遇到的情况 Best Buy EDI项目传输业务报…...

2023年郑州重点建设项目名单公布,中创“算力数据中心”项目入选!

4月7日,郑州市人民政府网站公布2023年郑州市重点建设项目名单,名单共列项目680个,总投资1.08万亿元,年度计划投资2691亿元。 在创新驱动能力提升项目名单里,中创算力与人民网人民数据(国家大数据灾备中心&a…...

Pytorch 容器 - 1. Module类介绍

目录 1. 基于Module构建自己的网络 2. Module的初始化变量 3. Modules中需要子类 forward() 4. Modules中其他内置函数 1. 基于Module构建自己的网络 torch.nn.Module是所有神经网络模块的基类,如何定义自已的网络: 由于 Module 是神经网络模块的基…...

百度墨卡托坐标转化笔记

一、墨卡托坐标转化 调研了python和java多种实现方式的转换,发现有的不符合需求,原因还没找到。 我是用百度地图返回的poi边界(返回的是墨卡托坐标) 转换的原理没有深入研究,直接拿来用的,测试可行&…...

每日学术速递4.12

CV - 计算机视觉 | ML - 机器学习 | RL - 强化学习 | NLP 自然语言处理 Subjects: cs.HC 随着新的“生成代理”论文的发布,LLM刚刚达到了一个重要的里程碑——通过使用 LLM,生成代理能够在受《模拟人生》启发的交互式沙箱中模拟类人行为。代理架构扩展…...

HarmonyOS/OpenHarmony公司级技术开发团队硬件基本配置清单

有朋友公司咨询进入HarmonyOS/OpenHarmony领域,组建技术团队,硬件设备的基本配置应该是怎么样的比较合适?这个是进入鸿蒙开发领域相关配置的第一步,我们以一个基本的团队配置为例说明,供想进入的团队参考。 HarmonyOS/…...

新一代信息技术赋能,安科瑞搭建智慧水务体系的新思路

随着新时期治水方针的逐步落实,水利现代化、智能化建设已开启,物联网、图像识别、数字孪生等新技术的成熟,也为智慧水务体系的搭建提供了技术保障,新时代治水新思路正逐步得到落实。本文对智慧水务的总体架构与包含的建设内容进行…...

37岁测试工程师被裁,120天没找到工作,无奈...

从短期来看,程序员的确算是个不错的工作,薪水也比一般岗位高很多,但是从长远来看,程序员的中年危机会比其他岗位来的更早,很多程序员只有到了35岁左右,才能真正认清楚互联网行业,尤其是被裁之后…...

Java容器使用注意点

前置:问题 判空集合转map集合遍历集合去重集合转数组数组转集合 一:集合判空 《阿里巴巴 Java 开发手册》的描述如下: 判断所有集合内部的元素是否为空,使用 isEmpty() 方法,而不是 size()0 的方式。 我们在开发中也…...

密文题解(图论+字典树)

题目大意 有一段长度为nnn的密文,密文的每一位都可以用一个非负整数来描述,并且每一位都有一个权值aia_iai​。你可以操作任意多次,每次操作可以选择任意一段密文,花费选择的所有位上权值的异或和的代价获得这段密文每一位的异或…...

Baumer工业相机堡盟工业相机如何通过BGAPISDK里的工具函数来计算工业相机的实时帧率(C#)

Baumer工业相机堡盟工业相机如何通过BGAPISDK里函数来计算相机的实时帧率(C#)Baumer工业相机Baumer工业相机的帧率的技术背景Baumer工业相机的帧率计算方式在BufferEvent声明显示FrameID设计显示帧率的函数Baumer工业相机通过BGAPI SDK计算帧率的优势​B…...

数据结构与常量(Java)

目录 1.字面常量 2. 数据类型 3. 变量 3.1 变量概念 3.2 语法格式 补充:变量 int long short double和float char boolean byte 4.类型转换 类型提升小结 5. 字符串类型 1. int 转成 String 2. String 转成 int 1.字面常量 类似System.Out.p…...

【LeetCode】剑指 Offer 54. 二叉搜索树的第k大节点 p269 -- Java Version

题目链接:https://leetcode.cn/problems/er-cha-sou-suo-shu-de-di-kda-jie-dian-lcof/ 1. 题目介绍( 54. 二叉搜索树的第k大节点) 给定一棵二叉搜索树,请找出其中第 k 大的节点的值。 【测试用例】: 示例 1: 示例2&…...

[工具类] post请求 获取request对象, 获取request的请求体(body)参数

目录 引言: 1. 获取request对象的几种常用方式 -> 1.1 获取请求对象 通过请求上下文对象 获取信息[推荐] -> 1.2 在controller层直接获取[不推荐 侵害性太强] -> 1.3 interceptor中获取[部分业务中使用] -> 1.4 request常用api简介 2. 获取request的body的工具…...

Golang 多版本安装小工具G

​ voidint制作的Golang版本安装管理,非常好用。想装就装,想换版本就换版本 除了一些使用go install的场景可能有不兼容,主要是安装了工具有时候不能直接用。 GitHub - voidint/g: Golang Version Manager​​​​​​​ 使用方式很简单&a…...

day29—选择题

文章目录1.HashSet子类依靠什么方法区分重复元素(C)2.以下代码在编译和运行过程中会出现什么情况(A)3.有这么一段程序,执行的结果是(C)1.HashSet子类依靠什么方法区分重复元素(C&…...

day8 互斥锁/读写锁的概念及使用、死锁的避免

目录 互斥锁的概念和使用 线程通信 - 互斥 互斥锁的创建和销毁 互斥锁的创建 互斥锁的销毁 互斥锁的使用 申请锁 释放锁 互斥锁的概念和使用 线程通信 - 互斥 临界资源: 一次只允许一个任务(进程、线程)访问的共享资源&#xff1b…...

Python智能内存管理策略深度拆解(CPython内存池机制全图谱曝光)

第一章:Python智能内存管理策略全景导览Python 的内存管理并非由开发者手动控制,而是通过一套高度集成的自动化机制协同运作,涵盖引用计数、循环垃圾回收(GC)、内存池分配(pymalloc)三大核心支柱…...

告别重复造轮子:用Matlab封装你的PyTorch模型,打造一个可复用的预测函数

工程化实践:将PyTorch模型封装为Matlab可复用预测模块 在工业仿真和科研计算领域,Matlab因其强大的矩阵运算能力和丰富的工具箱而广受欢迎。然而,当我们需要将训练好的PyTorch深度学习模型集成到现有Matlab工作流时,往往会遇到接…...

深度解析Wiki.js操作日志系统:构建企业级安全监控的完整方案

深度解析Wiki.js操作日志系统:构建企业级安全监控的完整方案 【免费下载链接】wiki- Wiki.js | A modern and powerful wiki app built on Node.js 项目地址: https://gitcode.com/GitHub_Trending/wiki78/wiki- 当团队协作编辑Wiki内容时,你是否…...

AgiBot World数据集实战:如何用百万级轨迹训练你的机器人策略(附避坑指南)

AgiBot World数据集实战:百万级轨迹训练机器人策略的完整指南 1. 数据集的革命性价值 在机器人学习领域,数据质量与规模直接决定了策略模型的性能上限。AgiBot World作为当前最大的开源机器人操作数据集,其核心突破在于: 规模突…...

Flax过滤器系统终极指南:如何实现灵活的变量选择机制

Flax过滤器系统终极指南:如何实现灵活的变量选择机制 【免费下载链接】flax Flax is a neural network library for JAX that is designed for flexibility. 项目地址: https://gitcode.com/GitHub_Trending/fl/flax Flax NNX的过滤器系统是神经网络编程中的…...

OptiScaler终极指南:打破DLSS垄断,让所有显卡都能享受AI超分辨率

OptiScaler终极指南:打破DLSS垄断,让所有显卡都能享受AI超分辨率 【免费下载链接】OptiScaler DLSS replacement for AMD/Intel/Nvidia cards with multiple upscalers (XeSS/FSR2/DLSS) 项目地址: https://gitcode.com/GitHub_Trending/op/OptiScaler…...

YOLOv9官方镜像快速入门:三步完成图片检测,支持自定义数据集训练

YOLOv9官方镜像快速入门:三步完成图片检测,支持自定义数据集训练 1. 环境准备与快速部署 YOLOv9官方训练与推理镜像已经预装了完整的深度学习开发环境,包含所有必要的依赖项。这意味着你不需要手动安装Python、CUDA或PyTorch,也…...

通义千问3-4B-Instruct-2507调优技巧:提高指令遵循准确率

通义千问3-4B-Instruct-2507调优技巧:提高指令遵循准确率 通义千问3-4B-Instruct-2507,这个听起来有点长的名字,其实是一个特别适合我们普通开发者和爱好者玩转的AI小模型。它只有40亿参数,但阿里在2025年8月把它开源出来的时候&…...

如何通过开源看板工具Kanboard实现团队高效协作

如何通过开源看板工具Kanboard实现团队高效协作 【免费下载链接】kanboard Kanban project management software 项目地址: https://gitcode.com/gh_mirrors/ka/kanboard 在当今快节奏的工作环境中,团队协作效率是项目成功的关键因素。Kanboard作为一款免费开…...

探索式学习:UMA模型在水分解催化中的应用指南

探索式学习:UMA模型在水分解催化中的应用指南 【免费下载链接】ocp Open Catalyst Projects library of machine learning methods for catalysis 项目地址: https://gitcode.com/GitHub_Trending/oc/ocp 突破传统计算瓶颈:UMA模型的核心价值解析…...