当前位置: 首页 > 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标签可以包含任意内容

代码:

 

 网页效果展示:

 

http://www.lryc.cn/news/59253.html

相关文章:

  • 在 Flutter 多人视频通话中实现虚拟背景、美颜与空间音效
  • Ambari-web 架构
  • 对接百思买Best Buy EDI 的注意事项
  • 2023年郑州重点建设项目名单公布,中创“算力数据中心”项目入选!
  • Pytorch 容器 - 1. Module类介绍
  • 百度墨卡托坐标转化笔记
  • 每日学术速递4.12
  • HarmonyOS/OpenHarmony公司级技术开发团队硬件基本配置清单
  • 新一代信息技术赋能,安科瑞搭建智慧水务体系的新思路
  • 37岁测试工程师被裁,120天没找到工作,无奈...
  • Java容器使用注意点
  • 密文题解(图论+字典树)
  • Baumer工业相机堡盟工业相机如何通过BGAPISDK里的工具函数来计算工业相机的实时帧率(C#)
  • 数据结构与常量(Java)
  • 【LeetCode】剑指 Offer 54. 二叉搜索树的第k大节点 p269 -- Java Version
  • [工具类] post请求 获取request对象, 获取request的请求体(body)参数
  • Golang 多版本安装小工具G
  • day29—选择题
  • day8 互斥锁/读写锁的概念及使用、死锁的避免
  • 2023-04-13 monetdb-str类型变长存储-分析
  • 011:Mapbox GL两种方式隐藏logo和版权,个性化版权的声明
  • 结合PCA降维的DBSCAN聚类方法(附Python代码)
  • 限流:计数器、漏桶、令牌桶 三大算法的原理与实战(史上最全)
  • Redis用于全局ID生成器、分布式锁的解决方案
  • OpenTex 企业内容管理平台
  • 【0基础学爬虫】爬虫基础之数据存储
  • Redis与本地缓存组合使用(IT枫斗者)
  • 手把手教你学习IEC104协议和编程实现 十 故障事件与复位进程
  • 浅析分布式理论的CAP
  • 使用 TensorFlow 构建机器学习项目:6~10