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

【HTML5】html5开篇基础(4)

1.❤️❤️前言~🥳🎉🎉🎉

Hello, Hello~ 亲爱的朋友们👋👋,这里是E绵绵呀✍️✍️。

如果你喜欢这篇文章,请别吝啬你的点赞❤️❤️和收藏📖📖。如果你对我的内容感兴趣,记得关注我👀👀以便不错过每一篇精彩。

当然,如果在阅读中发现任何问题或疑问,我非常欢迎你在评论区留言指正🗨️🗨️。让我们共同努力,一起进步!

加油,一起CHIN UP!💪💪

🔗个人主页:E绵绵的博客
📚所属专栏:

1. JAVA知识点专栏

        深入探索JAVA的核心概念与技术细节

2.JAVA题目练习

        实战演练,巩固JAVA编程技能

3.c语言知识点专栏

        揭示c语言的底层逻辑与高级特性

4.c语言题目练习

        挑战自我,提升c语言编程能力

5.Mysql数据库专栏

        了解Mysql知识点,提升数据库管理能力

6.html5知识点专栏

         学习前端知识,更好的运用它

📘 持续更新中,敬请期待❤️❤️

2.无序列表 

<ul>标签表示 HTML 页面中项目的无序列表,一般会以项目符号呈现列表项,而列表项使用 <li>标签定义。无序列表的基本语法格式如下:

<u1>
<]>列表项1</1i>
<1i>列表项2</1i>
<1i>列表项3</1i>
</u1>

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

<!DOCTYPE html>
<html lang="zh"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>无序列表示例</title>
</head><body><h2>无序列表</h2><ul><li>苹果</li><li>香蕉</li><li>橘子</li></ul>
</body></html>

 


3.有序列表

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

<o1>
<1i>列表项1</1i>
<1i>列表项2</1i>
<1i>列表项3</1i>
</o1>

1.<ol></ol>中只能嵌套<li></li>,直接在<o|></ol>标签中输入其他标签或者文字的做法是不被允许的。
2.<li>与 </i>之间相当于一个容器,可以容纳所有元素,如<P></P>

3.有序列表会带有自己样式属性,但在实际使用时,我们会使用CSS来设置将它不显示。

<!DOCTYPE html>
<html lang="zh"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>有序列表示例</title>
</head><body><h2>有序列表</h2><ol><li>第一步</li><li>第二步</li><li>第三步</li></ol>
</body></html>

4.自定义列表 

自定义列表常用于对术语或名词进行解释和描述,定义列表的列表项前没有任何符号。(有序列表和无序列表都有特殊符号)

如上就是自定义列表。

在 HTML标签中,<dl>标签用于定义描述列表,该标签会与<dt>(定义项目)和<dd>(描述每一个项目)一起使用。其基本语法如下:

<d1>
<dt>名词1</dt>
<dd>名词1解释1</dd>
<dd>名词1解释2</dd>
</d1>


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

3.<dt>与 </dt> 以及 <dd>与</dd>之间相当于一个容器,可以容纳所有元素,如<P></P>

<!DOCTYPE html>
<html lang="zh"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>单个描述项列表</title>
</head><body><h2>单个描述项示例</h2><dl><dt>HTML</dt><dd>超文本标记语言</dd><dd>用于定义网页的结构</dd><dd>非常有用</dd></dl>
</body></html>

如果想要达成网页一样的效果之后用css来修饰就行。 

相关文章:

【HTML5】html5开篇基础(4)

1.❤️❤️前言~&#x1f973;&#x1f389;&#x1f389;&#x1f389; Hello, Hello~ 亲爱的朋友们&#x1f44b;&#x1f44b;&#xff0c;这里是E绵绵呀✍️✍️。 如果你喜欢这篇文章&#xff0c;请别吝啬你的点赞❤️❤️和收藏&#x1f4d6;&#x1f4d6;。如果你对我的…...

HTTP【网络】

文章目录 HTTPURL(Uniform Resource Lacator) HTTP协议格式HTTP的方法HTTP的状态码HTTP常见的Header HTTP 超文本传输协议&#xff0c;是一个简单的请求-响应协议&#xff0c;HTTP通常运行在TCP之上 URL(Uniform Resource Lacator) 一资源定位符&#xff0c;也就是通常所说的…...

MQ延迟消息:原理、实现与应用

在现代分布式系统中&#xff0c;消息队列&#xff08;Message Queue&#xff0c;简称MQ&#xff09;已经成为实现异步通信、解耦服务和削峰填谷的重要工具。延迟消息&#xff08;Delayed Message&#xff09;作为MQ的一种高级特性&#xff0c;允许消息在指定的延迟时间后投递到…...

计算机网络—大端序和小端序

大端序和小端序 大端序&#xff08;Big-endian&#xff09;和小端序&#xff08;Little-endian&#xff09;是指在多字节数据类型&#xff08;如整数或浮点数&#xff09;的存储和表示方式上的不同。以下是关于大端序和小端序的详细解释&#xff1a; 一、定义 大端序&#xf…...

《OpenCV 计算机视觉》—— Harris角点检测、SIFT特征检测

文章目录 一、Harris 角点检测1.基本思想2.检测步骤3.OpenCV实现 二、SIFT特征检测1. SIFT特征检测的基本原理2. SIFT特征检测的特点3. OpenCV 实现 一、Harris 角点检测 OpenCV中的Harris角点检测是一种基于图像灰度值变化的角点提取算法&#xff0c;它通过计算每个像素点的响…...

rtmp协议转websocketflv的去队列积压

websocket server的优点 websocket server的好处&#xff1a;WebSocket 服务器能够实现实时的数据推送&#xff0c;服务器可以主动向客户端发送数据 1 不需要客户端不断轮询。 2 不需要实现httpserver跨域。 在需要修改协议的时候比较灵活&#xff0c;我们发送数据的时候比较…...

Elasticsearch实战应用:构建高效搜索引擎

在大数据时代&#xff0c;如何高效存储和检索海量信息成为了一个重要课题。Elasticsearch作为一个开源的分布式搜索引擎&#xff0c;以其强大的搜索能力和灵活的扩展性&#xff0c;成为了许多企业和开发者的首选。本文将深入探讨Elasticsearch的实战应用&#xff0c;包括基本概…...

Hive数仓操作(四)

一、Hive 创建表案例一&#xff08;ARRAY数组类型&#xff09; 1. 准备数据文件 首先&#xff0c;准备一个名为 stu2.txt 的文件&#xff0c;文件内容示例如下&#xff1a; 1001 Alice fish,cat 1002 Bob dog,rabbit 1003 Charlie bird注意&#xff1a; …...

《C++跨平台开发:突破界限,释放无限可能》

在当今的软件开发领域&#xff0c;跨平台开发已成为一种重要趋势。它允许开发者编写一次代码&#xff0c;然后在多个不同的操作系统和硬件平台上运行&#xff0c;极大地提高了开发效率和软件的可扩展性。而 C作为一种强大的编程语言&#xff0c;也具备实现跨平台开发的能力。本…...

速盾:免备案服务器?

速盾是一家提供网络安全服务的公司&#xff0c;其主要产品包括CDN加速、WEB防护、WAF、DDoS防护等。在网站建设过程中&#xff0c;选择一个合适的服务器是非常重要的一步。传统的服务器需要备案&#xff0c;涉及到较多的流程和审批时间&#xff0c;给网站运营带来了一定的麻烦。…...

Electron获取nodejs和chrome版本信息

Electron获取nodejs和chrome版本信息 环境&#xff1a; electron: 30.1.1 nodejs: 20.14.0代码 $ tree . --- index.html --- index.js --- package.jsonindex.html <!DOCTYPE html> <html><head><meta charset"UTF-8" /><title>H…...

【React】setState 批量更新

setState 批量更新的过程 React 的 setState 调用是异步的。为了性能原因&#xff0c;React 会将多个 setState 调用合并成一次批量更新。具体过程如下&#xff1a; 1&#xff09;React 先将调用的每个 setState 所产生的更新对象存储在一个队列中。 2&#xff09;在所有的同步…...

微信小程序开发日记第二天

坚持在各个平台更新自己写小程序的心得体会&#xff0c;在百度贴吧和csdn更新自己的小程序日记&#xff0c;同时也是个体不断地对于云技术的开发和成长&#xff0c;进行提升&#xff01;不断地将开源开放创新思维运用到自己的小程序当中&#xff0c;小程序制作的关键就是&#…...

如果您忘记了 Apple ID 和密码,按照指南可重新进入您的设备

即使您的 iPhone 或 iPad 由于各种原因被锁定或禁用&#xff0c;也可以使用 iTunes、“查找我的”、Apple 支持和 iCloud 解锁您的设备。但是&#xff0c;此过程需要您的 Apple ID 和密码来验证所有权并移除激活锁。如果您忘记了 Apple ID 和密码&#xff0c;请按照我们的指南重…...

Top4免费音频剪辑软件大比拼,2024年你选哪一款?

现在我们生活在一个数字化的时代&#xff0c;音频内容对我们来说很重要。不管是给自己拍的视频配背景音乐、整理开会时的录音&#xff0c;还是自己写歌&#xff0c;有个好用的音频剪辑软件都特别重要。今天&#xff0c;我要给大家介绍几款特别好用的音频剪辑软件免费的&#xf…...

基于SSM的电影院售票系统设计与实现

文未可获取一份本项目的java源码和数据库参考。 前言 近些年的电影在人们文娱活动中占据重要地位&#xff0c;另外&#xff0c;由于人们的生活越来越富有&#xff0c;越来越多的人们不再选择在家里看电影&#xff0c;而是选择去电影院看电影。但是&#xff0c;以往的售票方式是…...

uniapp 必须掌握的细节

1.使用watch实现实时监控的效果 例如&#xff1a;实时监测手机号码的示例 // 实时监测手机号码 watch(() > UserRegisterForm.value.phone, (newPhone) > {// 简单的手机号码正则表达式验证const phoneRegex /^1[3-9]\d{9}$/;tips.value.tipPhone !phoneRegex.test(n…...

JavaWeb——Vue组件库Element(3/6):常见组件:Dialog对话框、Form表单(介绍、使用、实际效果)

目录 Dialog对话框 介绍 使用 实际效果 Form表单 介绍 使用 实际效果 Dialog对话框 介绍 Dialog对话框&#xff1a;在保留当前页面状态的情况下&#xff0c;告知用户并承载相关操作。 Dialog 对话框组件可以在保留当前页面信息的状态下弹出一个对话框&#xff0c;并…...

一个月学会Java 第2天 认识类与对象

Day2 认识类与对象 第一章 初识类 经过一个程序的编写&#xff0c;应该对程序的结构有点好奇了吧&#xff0c;如果你有基础&#xff0c;接下来的肯定非常的易懂&#xff0c;如果你没有基础也没有关系&#xff0c;反复琢磨一下也就懂了&#x1f606; 我们来重复一下第一个程序 …...

【WRF数据准备】MODIS静态地理数据下载及制备

【WRF数据准备】MODIS静态地理数据下载及制备 MODIS数据介绍数据下载数据拼接MRT工具介绍基于MRT软件完成数据拼接 格式转换&#xff1a;tif文件转二进制格式编写INDEX修改GEOGRID.TBL以及namelist.wps修改GEOGRID.TBL修改namelist.wps 参考 MODIS数据介绍 MODIS-MCD12Q1 v061…...

利用最小二乘法找圆心和半径

#include <iostream> #include <vector> #include <cmath> #include <Eigen/Dense> // 需安装Eigen库用于矩阵运算 // 定义点结构 struct Point { double x, y; Point(double x_, double y_) : x(x_), y(y_) {} }; // 最小二乘法求圆心和半径 …...

解决Ubuntu22.04 VMware失败的问题 ubuntu入门之二十八

现象1 打开VMware失败 Ubuntu升级之后打开VMware上报需要安装vmmon和vmnet&#xff0c;点击确认后如下提示 最终上报fail 解决方法 内核升级导致&#xff0c;需要在新内核下重新下载编译安装 查看版本 $ vmware -v VMware Workstation 17.5.1 build-23298084$ lsb_release…...

MVC 数据库

MVC 数据库 引言 在软件开发领域,Model-View-Controller(MVC)是一种流行的软件架构模式,它将应用程序分为三个核心组件:模型(Model)、视图(View)和控制器(Controller)。这种模式有助于提高代码的可维护性和可扩展性。本文将深入探讨MVC架构与数据库之间的关系,以…...

学习STC51单片机31(芯片为STC89C52RCRC)OLED显示屏1

每日一言 生活的美好&#xff0c;总是藏在那些你咬牙坚持的日子里。 硬件&#xff1a;OLED 以后要用到OLED的时候找到这个文件 OLED的设备地址 SSD1306"SSD" 是品牌缩写&#xff0c;"1306" 是产品编号。 驱动 OLED 屏幕的 IIC 总线数据传输格式 示意图 …...

鱼香ros docker配置镜像报错:https://registry-1.docker.io/v2/

使用鱼香ros一件安装docker时的https://registry-1.docker.io/v2/问题 一键安装指令 wget http://fishros.com/install -O fishros && . fishros出现问题&#xff1a;docker pull 失败 网络不同&#xff0c;需要使用镜像源 按照如下步骤操作 sudo vi /etc/docker/dae…...

CMake 从 GitHub 下载第三方库并使用

有时我们希望直接使用 GitHub 上的开源库,而不想手动下载、编译和安装。 可以利用 CMake 提供的 FetchContent 模块来实现自动下载、构建和链接第三方库。 FetchContent 命令官方文档✅ 示例代码 我们将以 fmt 这个流行的格式化库为例,演示如何: 使用 FetchContent 从 GitH…...

汇编常见指令

汇编常见指令 一、数据传送指令 指令功能示例说明MOV数据传送MOV EAX, 10将立即数 10 送入 EAXMOV [EBX], EAX将 EAX 值存入 EBX 指向的内存LEA加载有效地址LEA EAX, [EBX4]将 EBX4 的地址存入 EAX&#xff08;不访问内存&#xff09;XCHG交换数据XCHG EAX, EBX交换 EAX 和 EB…...

pikachu靶场通关笔记22-1 SQL注入05-1-insert注入(报错法)

目录 一、SQL注入 二、insert注入 三、报错型注入 四、updatexml函数 五、源码审计 六、insert渗透实战 1、渗透准备 2、获取数据库名database 3、获取表名table 4、获取列名column 5、获取字段 本系列为通过《pikachu靶场通关笔记》的SQL注入关卡(共10关&#xff0…...

RNN避坑指南:从数学推导到LSTM/GRU工业级部署实战流程

本文较长&#xff0c;建议点赞收藏&#xff0c;以免遗失。更多AI大模型应用开发学习视频及资料&#xff0c;尽在聚客AI学院。 本文全面剖析RNN核心原理&#xff0c;深入讲解梯度消失/爆炸问题&#xff0c;并通过LSTM/GRU结构实现解决方案&#xff0c;提供时间序列预测和文本生成…...

深度学习习题2

1.如果增加神经网络的宽度&#xff0c;精确度会增加到一个特定阈值后&#xff0c;便开始降低。造成这一现象的可能原因是什么&#xff1f; A、即使增加卷积核的数量&#xff0c;只有少部分的核会被用作预测 B、当卷积核数量增加时&#xff0c;神经网络的预测能力会降低 C、当卷…...