【HTML】标签学习(下.2)

(大家好哇,今天我们将继续来学习HTML(下.2)的相关知识,大家可以在评论区进行互动答疑哦~加油!💕)

目录

二.列表标签

2.1 无序列表(重点) 

 2.2有序列表(理解) 

2.3 自定义列表(重点) 

2.4 列表总结 


二.列表标签

表格是用来显示数据的,那么列表就是用来布局的。

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

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

2.1 无序列表(重点

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

无序列表的基本语法格式如下: 

<ul> 
  <li>  列表项1  </li>
  <li>  列表项2  </li>
  <li>  列表项3  </li>

  ...
<ul> 

 特点:

  1. 无序列表的各个列表项之间没有顺序级别之分是并列的。
  2. <ul></ul>中只能嵌套<li></li>,直接在<ul></ul>标签中输入其他标签或者文字的做法是不被允许的。
  3. <li>与</li>之间相当于一个容器,可以容纳所有元素。
  4. 无序列表会带有自己的样式属性,但在实际使用时,我们会使用CSS来没置。 

 2.2有序列表(理解) 

有序列表即为有排序顺序的列表,其各个列表项会按照一定的顺序排列定义。 
在HTML标签中,<ol>标签用于定义有序列表,列表排序以数字来显示,并且使用<li>标签
来定义列表项。 
有序列表的基本语法格式如下 :

<ol> 
  <li>  列表项1  </li> 
  <li>  列表项2  </li>
  <li>  列表项3  </li>

  ...
<ol> 

 特点:

  1.  <ol>中只能嵌套<li></li>,直接在<ol></ol>标签中输入其他标签或者文字的做法是不被允许的。
  2. <li>与</li>之间相当于一个容器,可以容纳所有元素。 
  3. 有序列表会带有自己样式属性,但在实际便用时,我们会使用CSS来设置。

2.3 自定义列表(重点

  • 自定义列表的使用场景: 自定义列表常用于对术语或名词进行解释和描述,定义列表的列表项前没有任何项目的符号。 
  • 在HTML标签中,<dl>标签用于定义描述列表(或定义列表),该标签会与<dt>(定义项目/名字)和<dd>(描述一个项目/名字)一起使用。

<dl>

  <dt> 名词1 </dt>

  <dt> 名词2 </dt>

  <dt> 名词3 </dt>

  ...

</dl>

 特点:

1、<dl></dl>里面只能包含<dt>和<dd>。 
2、<dt>和<dd>个数没有限制,经常是一个<dt>对应多个<dd>。 

2.4 列表总结 

标签定义说明
<ul></ul>无序标签里面只能包含li,没有顺序,使用较多,li里可以包含任何标签
<ol></ol>有序标签里面只能包含li,有顺序,使用较少,li里可以包含任何标签
<dl></dl>自定义列表里面只能包含dt和dd, dt和dd里可以放任何标签

(今日分享暂时到此为止啦!为不断努力的自己鼓鼓掌吧。今日文案分享:若你决定灿烂,则山无遮海无拦。

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

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

相关文章

数字信号处理实验操作教程:3-3 mp3音频编码实验(AD7606采集)

一、实验目的 学习AD7606采集音频数据的方法并掌握MP3音频编码的原理&#xff0c;并实现AD7606采集音频数据进行MP3编码并保存到SD卡。 二、实验原理 AD7606原理图 硬件原理图&#xff0c;找到AD采集&#xff0c;可查看相关控制引脚&#xff0c;同时可看到ADC输入的V1V8通道…

稀碎从零算法笔记Day37-LeetCode:所有可能的真二叉树

今天的每日一题&#xff0c;感觉理解的还不够深&#xff0c;有待加深理解 题型&#xff1a;树、分治、递归 链接&#xff1a;894. 所有可能的真二叉树 - 力扣&#xff08;LeetCode&#xff09; 来源&#xff1a;LeetCode 题目描述 给你一个整数 n &#xff0c;请你找出所有…

记Postman参数化

因为需要在WEB页面上处理部分数据&#xff0c;手动操作太慢&#xff0c;所以考虑使用接口方式处理&#xff0c;因急于使用&#xff0c;用Python Request的方式&#xff0c;写代码也来得慢&#xff0c;故采用Postman加外部文件参数化方式来实现。 接口请求是Post方式&#xff0c…

【pysurvival Python 安装失败】

这个错误与 sklearn 包的名称更改有关&#xff0c;导致 pysurvival 在构建元数据时失败。现在&#xff0c;你需要修改 pysurvival 的安装文件以使用正确的 scikit-learn 包名 编辑安装文件&#xff1a;找到 pysurvival 的安装文件&#xff0c;可能是 setup.py 或 pyproject.to…

C语言题目练习

目录 前言 1 小乐乐与欧几里得 1.1题目 描述 输入描述&#xff1a; 输出描述&#xff1a; 1.2 解题 2 空心正方形图案 2.1 描述 输入描述&#xff1a; 输出描述&#xff1a; 2.2 解题 4 结语 前言 纸上得来终觉浅&#xff0c;觉知此事要躬行。C语言的学习不仅要了解…

【Qt 学习笔记】Qt 开发环境的搭建 | Qt 安装教程

博客主页&#xff1a;Duck Bro 博客主页系列专栏&#xff1a;Qt 专栏关注博主&#xff0c;后期持续更新系列文章如果有错误感谢请大家批评指出&#xff0c;及时修改感谢大家点赞&#x1f44d;收藏⭐评论✍ Qt 开发环境的搭建 | Qt 安装教程 文章编号&#xff1a;Qt 学习笔记 /…

搭建 Qt 开发环境

&#x1f40c;博主主页&#xff1a;&#x1f40c;​倔强的大蜗牛&#x1f40c;​ &#x1f4da;专栏分类&#xff1a;QT❤️感谢大家点赞&#x1f44d;收藏⭐评论✍️ 目录 一、QT SDK 的下载和安装 1.QT SDK 的下载 二、QT SDK的安装 1、找到下载的文件并双击 2、双击之…

智慧公厕,为智慧城市建设注入了新的活力

随着智慧城市的快速发展&#xff0c;公共厕所不再是简单的功能设施&#xff0c;而是成为了提升城市形象、改善民生服务的重要一环。智慧公厕作为新形态的公共厕所&#xff0c;通过精准监测公厕内部的人体活动状态、人体存在状态、空气质量情况、环境变化情况、设施设备运行状态…

Somme Requiem 全AI制作的电影短片

每周跟踪AI热点新闻动向和震撼发展 想要探索生成式人工智能的前沿进展吗&#xff1f;订阅我们的简报&#xff0c;深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同&#xff0c;从行业内部的深度分析和实用指南中受益。不要错过这个机会&#xff0c;成为AI领…

论文笔记:基于多粒度信息融合的社交媒体多模态假新闻检测

整理了ICMR2023 Multi-modal Fake News Detection on Social Media via Multi-grained Information Fusion&#xff09;论文的阅读笔记 背景模型实验 背景 在假新闻检测领域&#xff0c;目前的方法主要集中在文本和视觉特征的集成上&#xff0c;但不能有效地利用细粒度和粗粒度…

Git常用语句

设置用户名 git config --global user.name "用户名" git config --global user.email "邮箱"查看git用户信息 cat ~/.gitconfig初始化本地库 git initclone指定分支的代码 git clone -b my_branch gitgitlabxxxxxxxxxxxxxxxxxxxxxx.gitpush三件套 gi…

第13届蓝桥杯省赛 ---- C/C++ C组

文章目录 1. 字母排列2. 特殊时间3. 纸张尺寸4. 求和5. 数位排序6. 选数异或7. 消除游戏8. 重新排序9. 技能升级10. 重复的数 第13届蓝桥杯省赛C/C组题解。 1. 字母排列 这道题直接排序输出就好了。 #include <bits/stdc.h> using namespace std;char s[30];int main(…

vue2+element-ui 实现OSS分片上传+取消上传

遇到问题&#xff1a;项目中需要上传500MB以上的视频。一开始使用上传组件el-upload&#xff0c;调用后台接口&#xff0c;但是出现了onprogress显示百分百后接口一直pending&#xff0c;过了很多秒后接口才通&#xff0c;如果遇到大文件的话&#xff0c;接口就会报超时。 解决…

Python实现【贪吃蛇大作战】+源码

文章目录 前言&#xff1a;一、游戏概述1.游戏玩法2.游戏特色 二、游戏规则三、工具选择四、主要技术pygame 库numpy 库cocos2d 五、源码分享六、项目地址 前言&#xff1a; 今天的GitHub小游戏分享&#xff0c;我们将聚焦于一个经典而又极富趣味性的游戏——贪吃蛇大作战。这…

小米汽车正式发布:开启智能电动新篇章

随着科技的不断进步&#xff0c;汽车产业正经历着前所未有的变革。智能电动汽车作为这一变革的重要方向&#xff0c;正吸引着越来越多的目光。在这个充满机遇和挑战的时代&#xff0c;小米汽车凭借其卓越的技术实力和深厚的市场底蕴&#xff0c;终于迈出了坚实的一步。今天&…

护眼台灯是圆的好还是长方形的好?明基、书客、柏曼PK对比

护眼台灯作为现代人学习、工作的必备良伴&#xff0c;其形状的选择一直备受关注。市面上比较常见的有圆的和长方形两种形状。一般圆形光源的特点主要是灯光比较集中&#xff0c;采用对称的配光方式。条形光源的照射范围更广&#xff0c;光线在空间内分布均匀&#xff0c;各有特…

权限问题(Windows-System)

方法&#xff1a;用命令来写一个注册表的脚本 &#xff1f;System是最高级用户&#xff0c;但不拥有最高级权限 编写两文档&#xff1a;system.reg 和 remove.reg,代码如下&#xff1a; system.reg&#xff1a; Windows Registry Editor Version 5.00[-HKEY_CLASSES_ROOT\*…

谈谈考研数学几个常见误区

25考研数学&#xff0c;一定一定要吃透基础&#xff0c;练好计算 我之所以要强调这个&#xff0c;是因为现在的考研数学&#xff0c;越来越重视基础和计算的考察&#xff0c;题海战术已经过时&#xff0c;如果想要有效的提升自己&#xff0c;要进行针对性的学习。我去年考研的…

【zlm】音视频流与音频流合并的设计

目录 设想一 设想二 方案三 关键技术 测试语句 测试脚本 参考文档 设想一 //开始录制_option.mp4_save_path custom_path;_option.mp4_max_second max_second;vector<Track::Ptr> mytracks getTracks();auto src MediaSource::find( DEFAULT_VHOST, "1&quo…

基于ssm旅游资源网站(java项目+文档+源码)

风定落花生&#xff0c;歌声逐流水&#xff0c;大家好我是风歌&#xff0c;混迹在java圈的辛苦码农。今天要和大家聊的是一款基于ssm的旅游资源网站。项目源码以及部署相关请联系风歌&#xff0c;文末附上联系信息 。 项目简介&#xff1a; 旅游资源网站的主要使用者分为管理…