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

HTML 标签类型全面介绍

news 来源：原创 2025/6/29 5:48:55

HTML 标签类型全面介绍

HTML（HyperText Markup Language）是构建 Web 页面结构的基础语言。HTML 由不同类型的标签组成，每种标签都有特定的用途。本文将全面介绍 HTML 标签的分类及其用法。

1. HTML 标签概述

HTML 标签通常成对出现，由 开始标签 和 结束标签 组成，例如：

<p>这是一个段落</p>

某些标签是 自闭合 的，例如 <img> 和 <br>。

2. HTML 标签的分类

2.1 结构性标签（Layout Tags）

这些标签用于定义页面的整体结构。

<html>：定义 HTML 文档的根元素。
<head>：包含页面的元数据。
<body>：包含页面的主要内容。
<header>：定义网页的头部区域。
<footer>：定义网页的底部区域。
<main>：页面的主要内容。
<section>：定义一个独立的内容块。
<article>：独立的文章内容。
<nav>：导航栏。
<aside>：侧边栏。
<div>：块级容器。
<span>：行内容器。

示例：

<header><h1>网站标题</h1><nav><ul><li><a href="#">首页</a></li><li><a href="#">关于</a></li></ul></nav>
</header>

2.2 文本格式化标签（Text Formatting Tags）

用于修饰和格式化文本。

<h1> - <h6>：标题标签。
<p>：段落。
<br>：换行。
<hr>：水平分割线。
<b> / <strong>：加粗。
<i> / <em>：斜体。
<u>：下划线。
<mark>：高亮。
<sub> / <sup>：下标 / 上标。
<blockquote>：引用。
<code>：代码片段。

示例：

<p><strong>重要：</strong>请在 HTML 中使用语义化标签！</p>

示例：

<a href="https://www.example.com">访问示例网站</a>
<img src="image.jpg" alt="示例图片">

2.4 表单标签（Form Tags）

用于创建用户输入界面。

<form>：表单。
<input>：输入框。
<label>：标签。
<button>：按钮。
<textarea>：多行文本输入。
<select>：下拉列表。
<option>：下拉选项。
<fieldset>：分组表单。
<legend>：分组标题。
<datalist>：可选输入项。

示例：

<form><label for="name">姓名：</label><input type="text" id="name" name="name"><button type="submit">提交</button>
</form>

2.5 表格标签（Table Tags）

用于创建表格结构。

<table>：表格。
<tr>：行。
<th>：表头。
<td>：单元格。
<caption>：表格标题。
<thead> / <tbody> / <tfoot>：表格的不同部分。

示例：

<table><thead><tr><th>姓名</th><th>年龄</th></tr></thead><tbody><tr><td>张三</td><td>25</td></tr></tbody>
</table>

2.6 交互元素（Interactive Elements）

<details> / <summary>：可折叠内容。
<dialog>：对话框。
<progress>：进度条。
<meter>：度量值。

示例：

<details><summary>点击展开</summary><p>这里是隐藏的内容。</p>
</details>

3. 语义化标签的重要性

HTML5 引入了很多语义化标签，如 <header>、<article>、<section> 等，提升了可读性和 SEO 效果。

示例：

<header><h1>网站标题</h1>
</header>
<section><article><h2>文章标题</h2><p>文章内容...</p></article>
</section>

4. 结论

本文介绍了 HTML 标签的主要类型及其使用示例。掌握这些标签的用法，可以帮助你更好地构建网页结构，提高网页的可读性和可维护性。希望这篇文章对你有所帮助！🚀

HTML 标签类型全面介绍

HTML 标签类型全面介绍 HTML（HyperText Markup Language）是构建 Web 页面结构的基础语言。HTML 由不同类型的标签组成，每种标签都有特定的用途。本文将全面介绍 HTML 标签的分类及其用法。 1. HTML 标签概述 HTML 标签通常成对出现&#xf…...

编程日记 2025/6/29 5:48:55

【漫话机器学习系列】168.最大最小值缩放（Min-Max Scaling）

在机器学习和数据预处理中，特征缩放（Feature Scaling） 是一个至关重要的步骤，它可以使模型更稳定，提高训练速度，并优化收敛效果。最大最小值缩放（Min-Max Scaling） 是其中最常见的方…...

编程日记 2025/6/29 5:17:20

Spring Boot中对同一接口定义多个切面的示例，分别通过接口方式和注解方式实现切面排序，并对比差异

以下是Spring Boot中对同一接口定义多个切面的示例，分别通过接口方式和注解方式实现切面排序，并对比差异： 一、接口方式实现切面排序 1. 定义接口 // 服务接口 public interface MyService {void methodA();void methodB(); }// 接口实现类…...

编程日记 2025/6/28 6:58:59

基于SpringBoot的高校学术交流平台

作者：计算机学姐开发技术：SpringBoot、SSM、Vue、MySQL、JSP、ElementUI、Python、小程序等，“文末源码”。专栏推荐：前后端分离项目源码、SpringBoot项目源码、Vue项目源码、SSM项目源码、微信小程序源码精品专栏：…...

编程日记 2025/6/29 5:29:44

数据治理的专题库

数据治理专题库的全面解析一、专题库的定义与定位数据治理专题库是围绕特定业务领域或场景构建的专业化数据库，其核心在于业务导向性和自主性。与基础库（如人口、法人、地理信息等跨部门核心实体数据）和主题库（如市场监管中的…...

编程日记 2025/6/28 7:09:41

【MathType】MathType安装和嵌入word

MathType 是一款功能强大的数学公式编辑器，广泛应用于学术论文、教材编写、科研报告等领域。它支持多种数学符号、公式排版，并且与 Microsoft Word、Google Docs、WPS 等办公软件兼容，极大地方便了数学公式的输入和编辑记录一下安装的过程 …...

编程日记 2025/6/28 3:26:13

mediacodec服务启动时加载media_codecs.xml

media.codec服务启动时， 会创建 implementation::Omx 和 implementation::OmxStore， 构造 Omx时， 会解析codec相关的xml文件，一般从会如下目录中， // from getDefaultSearchDirs() { "/product/etc",&quo…...

编程日记 2025/6/28 1:20:12

Scala（三）

本节课学习了函数式编程，了解到它与Java、C函数式编程的区别；学习了函数的基础，了解到它的基本语法、函数和方法的定义、函数高级。。。学习到函数至简原则，高阶函数，匿名函数等。函数的定义函数基本语法例子&…...

编程日记 2025/6/28 6:46:45

kafka 报错消息太大解决方案 Broker: Message size too large

kafka-configs.sh --bootstrap-server localhost:9092 \ --alter --entity-type topics \ --entity-name sim_result_zy \ --add-config max.message.bytes10485880 学习营课程...

编程日记 2025/6/28 7:01:52

异步IO 定时(协程） import asyncio import logging from apscheduler.schedulers.asyncio import AsyncIOScheduler from apscheduler.triggers.cron import CronTriggerlogging.basicConfig(levellogging.INFO) logger logging.getLogger(__name__)class Schedul…...

编程日记 2025/6/28 5:31:21

[GESP202503 C++六级题解]：P11962：树上漫步

[GESP202503 C++六级题解]：P11962：树上漫步题目描述小 A 有一棵 n n n 个结点的树，这些结点依次以 1 , 2 , ⋯ , n 1,2,\cdots,n 1,2,⋯,n 标号。小 A 想在这棵树上漫步。具体来说，小 A 会从树上的某个结点出发，每⼀步可以移动到与当前结点相邻的结点，并且小 A…...

编程日记 2025/6/28 7:03:26

JavaScript基础-常见网页特效案例

在现代Web开发中，JavaScript不仅是处理业务逻辑的核心工具，也是实现丰富交互体验的关键。通过JavaScript，我们可以轻松地为网页添加各种动态效果和交互特性，从而提升用户体验。本文将介绍几种常见的网页特效案例，并提供…...

编程日记 2025/6/29 5:21:49

数据结构4

day4 5.队列 Queue 5.1 特性队列是只允许再两端进行插入和删除操作的线性表，在队尾插入，在队头删除，插入的一段被称为“队尾”，删除的一端被称为“队头”。队列包括循环队列(顺序队列)、链式队列。结构：先进先出&…...

编程日记 2025/6/28 3:43:30

Rust 为什么不适合开发 GUI

前言在当今科技蓬勃发展的时代，Rust 编程语言正崭露头角，逐步为世界上诸多重要基础设施提供动力支持。从存储海量信息到应用于 Linux 内核，Rust 展现出强大的实力。然而，当涉及构建 GUI（图形用户界面）时&…...

编程日记 2025/6/28 1:20:10

DisplayPort版本对比

目前视频接口标准基本上被HDMI和DisplayPort两大标准给瓜分天下了。 （1） HDMI由消费电子厂商主导，最新版本（如HDMI 2.1）理论带宽为48Gbps，主要应用于电视、游戏主机及家庭影音设备。 （2&#xf…...

编程日记 2025/6/28 5:44:33

YOLOv12即插即用-Pconv(风车卷积)

1.模块介绍 PinwheelConv（风车状卷积）充分利用了IRST（红外搜索与跟踪）中的高斯分布特性，以极少的参数实现了高效且更大感受野的特性。此外，本文还提出了一种简单而高效的 SD 损失函数，有效缓解了标签 IoU 变化带来的不稳定性。通过与现有卷积模块和损失函数的广泛对比，…...

编程日记 2025/6/28 6:29:21

AI知识补全（十四）：零样本学习与少样本学习是什么？

名人说：一笑出门去，千里落花风。——辛弃疾《水调歌头我饮不须劝》创作者：Code_流苏(CSDN)（一个喜欢古诗词和编程的Coder😊） 上一篇：AI知识补全（十三）：注意力…...

编程日记 2025/6/28 6:31:46

Pycharm(十一）:字符串练习题

1.输入一个字符串，打印所有偶数位上的字符(下标是0，2，4，6...位上的字符) # 练习题1:输入一个字符串，打印所有偶数位上的字符(下标是0，2，4，6...位上的字符) # 1.键盘录入字符串&…...

编程日记 2025/6/28 6:46:49

设计原则之迪米特法则

一、定义迪米特法则又称为最少知识原则（Law of Demeter，LoD），是一项用于面向对象设计的基本原则之一。该原则强调一个对象应该对其他对象有最少的了解，即一个类不应该知道太多关于其他类的内部细节。二、好处迪米…...

编程日记 2025/6/28 4:36:28

Debian系统_主板四个网口1个配置为WAN，3个配置为LAN

Debian系统_主板四个网口1个配置为WAN，3个配置为LAN 一、重新配置网口 1、查看当前网口的状态 ifconfig 或者 ip link show 或者 ls /sys/class/net 2、修改网络配置文件 sudo vi /etc/network/interfaces 注意WAN口的网关地址如果是192.168.3.1的话，L…...

编程日记 2025/6/28 4:17:13

Spring Boot 快速入手

前言：为什么选择 Spring Boot？ 🚀 在现代 Java 开发中，Spring Boot 已成为最流行的后端框架之一。无论是小型 Web 应用、企业级系统，还是微服务架构，Spring Boot 都能提供快速开发、自动配置、轻量级部署的…...

编程日记 2025/6/28 3:16:23

Ubuntu Live USB 如何使用

以下是使用 Ubuntu Live USB 的详细指南，涵盖启动、试用系统、安装系统及常用工具操作： 1. 制作 Ubuntu Live USB • 所需工具： • Ubuntu ISO 镜像（从官网下载）。 • U盘（至少 4GB，数据将被…...

编程日记 2025/6/28 6:28:43

基于单片机的音乐播放器系统设计

基于单片机的音乐播放器系统设计是一个综合性较强的电子系统开发项目系统概述基于单片机的音乐播放器旨在利用单片机的控制功能，结合音频处理电路、存储单元等，实现音乐的播放、暂停、切换、音量调节等功能，可应用于小型便携式音频设备、电子玩具、智能家居背景音乐系统等…...

编程日记 2025/6/28 6:08:38

HttpClient-01.介绍

一.介绍通过HttpClient，我们可以在Java程序中构造并发送Http请求。要使用HttpClient，就要导入依赖坐标。核心API： HttpClient：Http客户端，使用它可以发送http请求。 HttpClients：构建器，使…...

编程日记 2025/6/27 11:25:41

2025年win10使用dockerdesktop安装k8s

一、写作背景百度了一圈， 要么教程老，很多操作步骤冗余， 要么跑不通，或者提供的链接失效等情况。二、看前须知 1、安装过程使用的AI辅助， 因为参考的部分博客卡柱了。 2、如果操作过程中遇到卡顿， …...

编程日记 2025/6/28 5:51:50

技术回顾day2

1.获取文件列表流程：前端根据查询条件封装查询信息，后端接收后进行封装，封装为FileInfoQuery,根据fileInfoQuery使用mybatis的动态sql来进行查询。 2.文件分片上传每次上传需要上传包括(文件名字，文件，md5值&#…...

编程日记 2025/6/28 6:16:56

软件工程-UML

例图，类图，状态图，顺序图，活动图目录例图类图状态图顺序图活动图例图例图由四个元素组成，参与者、用例、系统边界、参与者和用例之间的关系参与者用一个小人表示，用例用椭圆表示&#xff…...

编程日记 2025/6/28 3:26:49

赛逸展2025“创新引擎”启动：限量席位，点亮科技绿色新征程

当今时代，科技革新与绿色发展已然成为推动社会进步的双引擎。2025第七届亚洲消费电子技术贸易展（赛逸展）敏锐捕捉这一趋势，重磅打造“科技创新专区”，并面向科技、绿色企业吹响限量招募号角。这个独具特色的专区紧扣…...

编程日记 2025/6/28 4:32:07

前后台系统

前后台系统（Foreground/Background System）是一种常见的嵌入式系统编程模型，尤其是在那些不需要复杂操作系统的简单系统中。这种系统架构通常用于实时性要求不是极端苛刻的环境，但在响应外部事件时仍需要一定的及时性。下面我将详…...

编程日记 2025/6/28 4:43:07

VHT AMPDU

A - MPDU 由一个或多个 A - MPDU 子帧以及可变数量的 EOF填充子帧组成。在 VHT中，存在如下填充：一个 A - MPDU 子帧的填充子字段中有 0 - 3 个字节。 EOF 填充字段中有零个或多个 EOF 填充子帧。 EOF 填充子帧中EOF填充字节中有 0 - 3 个字节。 A - MPDU 帧结束前填充（A -…...

编程日记 2025/6/28 5:51:43

Spring框架如何做EhCache缓存？

在Spring框架中，缓存是一种常见的优化手段，用于减少对数据库或其他资源的访问次数，从而提高应用性能。Spring提供了强大的缓存抽象，支持多种缓存实现（如EhCache、Redis、Caffeine等），并可以通过…...

编程日记 2025/6/28 6:52:33

助力 Windows 文件管理：重命名与清理重复文件软件精选

软件介绍在日常的电脑使用中，高效管理文件至关重要。接下来为大家介绍几款实用软件，能助您轻松搞定文件管理难题。 AdvancedRenamer：全能批量重命名利器专为 Windows 系统打造的 AdvancedRenamer，功能堪称强大。无论是文本替…...

编程日记 2025/6/28 5:24:56

重建二叉树（C++）

目录 1 问题描述 1.1 示例1 1.2 示例2 1.3 示例3 2 解题思路 3 代码实现 4 代码解析 4.1 初始化 4.2 递归部分 4.3 主逻辑 5 总结 1 问题描述给定节点数为 n 的二叉树的前序遍历和中序遍历结果，请重建出该二叉树并返回它的头结点。例如输入前序遍历序…...

编程日记 2025/6/28 5:51:58

Go+Gin实现安全多文件上传：带MD5校验的完整解决方案

后端 package mainimport ("encoding/json""fmt""log""net/http""os""path/filepath""github.com/gin-contrib/cors""github.com/gin-gonic/gin" )// 前端传来的文件元数据 type FileMetaRe…...

编程日记 2025/6/28 7:17:33

SwanLab Slack通知插件：让AI训练状态同步更及时

在AI模型训练的过程中，开发者常常面临一个难题：如何及时跟踪训练状态？无论是实验超参数的调整、关键指标的变化，还是意外中断的告警，传统的监控方式往往依赖手动刷新日志或反复检查终端，这不仅效率低下&…...

编程日记 2025/6/28 3:53:34

JavaScript元素尺寸与位置

目录 client 家族与 offset 家族一、client 家族：内容区域内边距示例代码应用场景二、offset 家族：内容区域内边距边框滚动条示例代码应用场景三、综合应用场景 1. 动态调整元素高度 2. 拖拽元素 3. 判断元素是否在视口内四…...

编程日记 2025/6/28 4:13:20

IS-IS：单区域集成配置与多区域集成配置

一、IS-IS概述 IS-IS（Intermediate System to Intermediate System） 是一种链路状态内部网关协议（IGP），设计用于自治系统（AS）内部的路由选择。最初由ISO为OSI模型的无连接网络服务（…...

编程日记 2025/6/28 3:45:02

Cesium学习（未完继续）

添加底图 viewer.imageryLayers.addImageryProvider(imageryProvider)常见 ImageryProvider 实现类 ArcGisMapServerImageryProvider：用于从 ArcGIS Server 获取影像数据。 BingMapsImageryProvider：用于从 Bing Maps 获取影像数据。 OpenStreetMapIm…...

编程日记 2025/6/28 4:33:15

【学Rust写CAD】22 双圆径向渐变的结构体(two_circle_radial_gradient.rs)

源码 //two_circle_radial_gradient.rs //! 定义双圆径向渐变的结构体和相关功能/// 表示一个双圆径向渐变的源 /// /// 该结构体描述了两个圆之间的渐变，支持矩阵变换和颜色查找表优化 #[derive(Debug, Clone, PartialEq)] pub struct TwoCircleRadialGradientSou…...

编程日记 2025/6/28 1:20:21

基于SpringAOP面向切面编程的一些实践（日志记录、权限控制、统一异常处理）

前言 Spring框架中的AOP（面向切面编程） 通过上面的文章我们了解到了AOP面向切面编程的思想，接下来通过一些实践，去更加深入的了解我们所学到的知识。简单回顾一下AOP的常见应用场景日志记录：记录方法入参、返回值、执…...

编程日记 2025/6/23 7:51:36

acwing 5438. 密接牛追踪2

农夫约翰有 NN 头奶牛排成一排，从左到右依次编号为 1∼N。不幸的是，有一种传染病正在蔓延。最开始时，只有一部分奶牛受到感染。每经过一个晚上，受感染的牛就会将病毒传染给它左右两侧的牛（如果有的话&#xff09…...

编程日记 2025/6/28 11:52:55

【Linux】线程池

目录线程池日志线程池在程序中，会预先创建一批线程，在内部会有一个叫任务队列task_queue的东西，未来如果有任务要处理，就把任务push到任务队列里，然后自动有线程去任务队列里拿任务并处理，如果没有任…...

编程日记 2025/6/28 5:30:48

【11408】考研英语长难句解析策略：三步断开与简化法，快速提升阅读得分

2025.04.01 英语断开长难句分析主谓心得简化长难句心得英语断开长难句在一些长难句中，有时从句的连词会被省略，且没有标点将其隔开，此时就无法通过标点和连接词来断开长难句。那么我们只能够通过分析主谓来断开长难句。分析主谓谓语…...

编程日记 2025/6/28 5:45:26

Spring Cloud 2023.x安全升级：OAuth2.1与JWT动态轮换实战

引言：当安全遇上云原生，零停机密钥轮换成为刚需在微服务架构中，OAuth2.1与JWT已成为身份验证的黄金标准，但传统方案存在两大痛点： 密钥轮换风险：手动替换JWT密钥需重启服务，导致短暂鉴权中断&…...

编程日记 2025/6/28 6:29:33

Vue3.5 企业级管理系统实战（十二）：组件尺寸及多语言实现

1 组件尺寸切换 1.1 用 Pinia 进行 Size 的持久化存储首先，在 src/plugins/element.ts 中增加 size 类型，代码如下： //src/plugins/element.ts import type { App } from "vue";import { ElMessage, ElNotification, ElMessageBo…...

编程日记 2025/6/28 7:05:26