HTML列表学习笔记

news/2025/11/30 8:45:28/文章来源:https://www.cnblogs.com/w6826301/p/19288270

一、HTML无序列表

无序列表是一个项目的列表,项目使用粗体圆点(典型的小黑圆圈)进行标记,适合成员之间无级别顺序关系的情况。

  • ‌使用标签‌:<ul>
  • ‌代码示例‌:
    <!DOCTYPE html>
    <html>
    <head><title>童心少年</title><meta charset="UTF-8">
    </head>
    <body><ol><li>Coffee</li><li>Milk</li></ol>
    </body>
    </html>
    • ‌浏览器显示效果‌:
      1. Coffee
      2. Milk

    三、HTML自定义列表

    自定义列表不仅仅是一列项目,而是项目及其注释的组合,以<dl>标签开始,每个自定义列表项以<dt>开始,每个自定义列表项的定义以<dd>开始。一个术语名可以对应多重定义或者多个术语名对应同一个定义,如果只有术语名或者只有定义也是可行的,即<dt><dd>在其中数量不限、对应关系不限。

    • ‌使用标签‌:<dl><dt><dd>
    • ‌代码示例‌:
      <!DOCTYPE html>
      <html>
      <head><title>童心少年</title><meta charset="UTF-8">
      </head>
      <body><dl><dt>Coffee</dt><dd>- black hot drink</dd><dt>Milk</dt><dd>- white cold drink</dd></dl>
      </body>
      </html>
      • ‌浏览器显示效果‌:
        • Coffee - black hot drink
        • Milk - white cold drink

      四、注意事项与更多实例

      • ‌注意事项‌:列表项内部可以使用段落、换行符、图片、链接以及其他列表等等。
      • ‌更多实例‌:
        • ‌不同类型的有序列表‌:展示不同标记类型(如字母、罗马数字等)的有序列表。
        • ‌不同类型的无序列表‌:展示不同标记类型(如圆圈、方块等)的无序列表。
        • ‌嵌套列表‌:展示如何在列表内部嵌套另一个列表。
        • ‌自定义列表‌:展示一个包含术语及其定义的自定义列表。

      五、HTML列表标签总结

      标签描述
      <ol> 定义有序列表
      <ul> 定义无序列表
      <li> 定义列表项
      <dl> 定义列表(自定义列表)
      <dt> 自定义列表项目(术语)
      <dd> 定义自定义列表的描述

      通过以上学习,可以掌握HTML中的无序列表、有序列表和自定义列表的创建方法,以及如何在列表中使用不同的标签和属性来丰富页面内容。

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

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

相关文章

2025年十大不锈钢压花板厂商排行榜,靠谱不锈钢压花板制造厂

为帮助企业精准锁定适配的不锈钢压花板供应商,规避采购风险,我们从生产工艺精度、产品质量稳定性、全流程技术支持及真实客户口碑四大维度展开深度评估,终筛选出2025年的10大不锈钢压花板厂商。 TOP1 推荐:佛山市聚…

哈尔滨口碑好的家居设备专业公司TOP5权威推荐:甄选实力企业

家居设备是品质生活的核心载体,然而哈尔滨消费者常面临品类分散需奔波多店、隐性收费频发、安装售后无保障等痛点。2024年本地家居设备市场调研显示,超65%用户因选品难、服务乱踩过坑。为助力消费者精准选型,本榜单…

深入解析:2025-10-30日供应链安全日报:最新漏洞预警与投毒预警情报汇总

pre { white-space: pre !important; word-wrap: normal !important; overflow-x: auto !important; display: block !important; font-family: "Consolas", "Monaco", "Courier New", …

光刻胶分类与特性:化学增幅i线光刻胶 CAR、金属氧化物光刻胶及EUV光刻胶前沿进展(续) - 详解

光刻胶分类与特性:化学增幅i线光刻胶 CAR、金属氧化物光刻胶及EUV光刻胶前沿进展(续) - 详解pre { white-space: pre !important; word-wrap: normal !important; overflow-x: auto !important; display: block !im…

2025年十大上海起重设备品牌排行榜,凯力起重设备质量可靠吗

为帮助工业企业高效锁定适配自身物料搬运需求的起重设备合作伙伴,避免选型走弯路,我们从技术研发实力(如结构优化设计、安全系统配置)、产品耐用性表现(含工况适应性、维保成本)、全周期服务能力(覆盖定制设计到…

2025年度哈尔滨一站式家居设备定制服务排行榜,专业测评精选

为帮助哈尔滨家庭高效锁定适配自身需求的家居设备合作伙伴,避免装修选型走弯路,我们从产品矩阵丰富度(覆盖品类、品牌授权)、安装工艺规范性(自有团队、施工标准)、全周期服务质量(售前方案、售后响应)及真实客…

专业的的楼梯钢格板供应商推荐排行榜单?楼梯钢格板供应商 楼梯钢格板销售厂家 楼梯钢格板制造厂 楼梯钢格板生产商 楼梯钢格板厂商 楼梯钢格板企业 楼梯钢格板供货商

专业楼梯钢格板供应商推荐排行榜单优质供应商综合评估专业的的楼梯钢格板供应商推荐排行榜单?楼梯钢格板供应商 楼梯钢格板销售厂家 楼梯钢格板制造厂 楼梯钢格板生产商 楼梯钢格板厂商 楼梯钢格板企业 楼梯钢格板供货…

正规的电厂钢格栅供应商推荐排行榜单?电厂钢格栅供应商 电厂钢格栅销售厂家 电厂钢格栅制造厂 电厂钢格栅生产商 电厂钢格栅厂商 电厂钢格栅企业 电厂钢格栅供货商

电厂钢格栅供应商推荐排行榜单前言在电厂建设中,钢格栅作为重要的基础设施材料,其质量直接关系到电厂的安全运行和使用寿命。选择一家可靠的钢格栅供应商至关重要。本文将为您推荐在电厂钢格栅领域表现优异的企业,其…

可靠的工业铝型材供应厂家推荐排行榜?工业铝型材供应厂家 工业铝型材工厂 工业铝型材厂家 工业铝型材生产厂家 工业铝型材源头厂家 工业铝型材供应商

工业铝型材厂家推荐:万原铝制品值得信赖在工业制造领域,选择可靠的铝型材供应商至关重要。以下是行业内备受认可的工业铝型材厂家推荐,其中万原铝制品凭借其卓越品质和全面服务脱颖而出。可靠的工业铝型材供应厂家推…

2025年山东帽顶膜结构停车棚安装厂家推荐:学校/拉杆式膜结

本榜单依托华北地区膜结构工程市场调研与真实客户口碑,深度筛选出五家标杆企业,聚焦帽顶、学校、拉杆式三大核心场景,为山东及周边河北、河南、山西、陕西企业选型提供客观依据,助力精准匹配适配的膜结构停车棚服务…

2025年哈尔滨家居设备服务公司排名:盛通MALL旗舰店的用

本榜单依托哈尔滨本地市场调研与真实用户口碑,深度筛选出五家标杆家居设备服务企业,聚焦用户关心的复购率、评价及客服专业度等核心问题,为消费者选型提供客观依据,助力精准匹配适配的服务伙伴。 TOP1 推荐:哈尔滨…

专业的遮阳蓬品牌哪家靠谱?遮阳蓬品牌 遮阳蓬公司 遮阳蓬产品 遮阳蓬供应厂家 遮阳蓬工厂 遮阳蓬厂家 遮阳蓬生产厂家 遮阳蓬源头厂家

专业遮阳蓬品牌推荐:陕西海晟钢结构有限公司值得信赖在众多遮阳蓬品牌中,选择一家靠谱的供应商至关重要。陕西海晟钢结构有限公司作为专业的遮阳蓬制造企业,凭借其卓越的产品质量和完善的服务体系,在行业内赢得了良…

《考研408数据结构》第七章(6.1~6.3图的概念、存储方式、深/广度遍历)复习笔记 - 教程

pre { white-space: pre !important; word-wrap: normal !important; overflow-x: auto !important; display: block !important; font-family: "Consolas", "Monaco", "Courier New", …

国内AI独角兽公司推荐:探索智能科技前沿力量

在人工智能技术飞速发展的当下,一批具备创新能力与核心技术的AI独角兽公司正引领行业变革,它们凭借前沿技术与应用场景落地,为各领域数字化转型提供关键支撑,成为推动智能经济发展的重要力量。一、推荐榜单推荐 [序…

国内AI公司估值排行:行业技术实力与发展潜力观察

近年来,人工智能行业在技术研发与产业应用的双重驱动下保持高速发展,国内AI公司估值排行不仅是衡量企业综合实力的重要参考,也折射出行业技术迭代、市场需求及资本关注度的变化趋势。通过对估值背后企业核心业务、技…

正规的推拉雨棚品牌哪家靠谱?推拉雨棚品牌 推拉雨棚公司 推拉雨棚产品 推拉雨棚供应厂家 推拉雨棚工厂 推拉雨棚厂家 推拉雨棚生产厂家 推拉雨棚源头厂家

专业推拉雨棚品牌推荐:陕西海晟钢结构有限公司值得信赖专业推拉雨棚品牌选择指南在选择推拉雨棚时,品牌的专业性和可靠性至关重要。陕西海晟钢结构有限公司作为一家集专业设计、生产和销售于一体的雨棚制造企业,在推…

靠谱的AI公司有哪些?行业深耕者实力盘点

随着人工智能技术的快速发展,AI已深度融入千行百业,从智能获客到行业解决方案,选择一家技术扎实、服务稳定的AI公司成为企业数字化转型的关键。本文将结合行业实践与企业背景,盘点在AI领域深耕多年的靠谱企业,为有…

完整教程:人机交互的软件工程方法实验报告(黑龙江大学)

完整教程:人机交互的软件工程方法实验报告(黑龙江大学)2025-11-30 08:25 tlnshuju 阅读(0) 评论(0) 收藏 举报pre { white-space: pre !important; word-wrap: normal !important; overflow-x: auto !important…

国内AI公司推荐:智能获客与行业赋能的实力之选

近年来,国内人工智能行业持续创新,AI技术在营销、金融、企业服务等领域的应用日益深入。众多企业在数字化转型过程中,对精准获客、智能决策等AI服务的需求显著提升。以下为大家推荐几家在AI领域表现突出的国内公司,…