契子
HTML 中提供了丰富的标签，用于构建和组织网页内容。以下是常用的其他标签及其用途：
主根元素
- <html>：HTML文档根元素（顶级元素）
文档元数据
元数据（Metadata）含有页面的相关信息，包括样式、脚本及数据，能帮助一些软件（例如 搜索引擎 (en-US)、浏览器 等等）更好地运用和渲染页面。对于样式和脚本的元数据，可以直接在网页里定义，也可以链接到包含相关信息的外部文件。
- <head>：规定文档相关的配置信息（元数据），包括文档的标题，引用的文档样式和脚本等
- <link>：引入外部资源，规定了当前文档与外部资源的关系。最常用于引入样式表
- <meta>：元信息
- <style>：内嵌样式
- <title>：网页标题
容器标签
- <div>：通用布局容器标签。
- <article>：用于文章、新闻或博客的容器标签。(H5)
- <section>：表示文档中的一个部分或章节，可用于对页面内容进行分块，通常包含一组相关内容。(H5)
- <aside>：用于表示页面的侧边栏或与主要内容相关的辅助信息部分，如引用、广告、导航等。(H5)
- <nav>：用于创建导航菜单，包含一系列链接，引导用户浏览网站的不同页面或部分。(H5)
- <header>：常包含页面或页面中某个部分的标题、logo 等信息，一般位于页面或部分的顶部。(H5)
- <footer>：一般位于页面或部分的底部，包含版权信息、联系方式、相关链接等信息。(H5)
- <main>：表示文档的主要内容部分，通常包含页面的核心信息，一个页面中通常只出现一次，可帮助搜索引擎和辅助技术快速定位主要内容。(H5)
- <blockquote>：用于引用较长的内容，通常是一段较长的引用文本，会有缩进等样式来区分引用内容和普通内容，常和
<cite>一起使用以表示引用的来源。 - <figure>：用于对一些独立的内容进行分组，通常包含
<figcaption>和其他元素，如图像、图表、代码示例等，可使页面内容更具语义性。 - <figcaption>：通常和
<figure>一起使用，用于为<figure>中的内容提供标题或说明，放置在<figure>内部。
文本标签
-
<p>：用于显示段落内容，包含一段文本信息。
-
<hgroup>：标题容器。(H5)
-
<h1~h6>：分别表示不同级别的标题，从最重要的一级标题到相对不重要的六级标题。
-
<span>：文本标签，一般用于描述一段文字信息或短文本。
-
<strong>：表示重要的文本，通常以粗体显示，用来强调文本的重要性。
-
<em>：表示强调的文本，通常以斜体显示，用于为文本添加强调效果。
-
<i>：使文本以斜体显示，一般用于表示不同的心境、声音、技术术语等，语义上不如
<em>强。 -
<b>：使文本以粗体显示，可用于突出显示文本，但语义上不如
<strong>强。 -
<u>：给文本添加下划线。
-
<s>：表示删除线，用于显示已删除或不再相关的文本。
-
<abbr>：用于表示缩写或首字母缩略词，通过
title属性提供完整的解释，当用户将鼠标悬停在元素上时可以显示完整信息。 -
<address>：用于表示联系信息，通常用于显示作者或网站的地址、电子邮件等，一般显示为斜体。
-
<ins>：表示插入的文本，通常会以下划线或不同的样式突出显示，可用于标记添加的内容，例如修订文档时添加的部分。
-
<sup>：使文本显示为上标，常用于数学公式、脚注引用等，例如
x<sup>2</sup>表示x的平方。 -
<sub>：使文本显示为下标，常用于化学公式、数学公式等，例如
H<sub>2</sub>O表示水的化学分子 -
<del>：表示删除的文本，通常会显示为删除线，可用于标记文档中已删除的部分，例如
<del>旧内容</del>。 -
<q>：用于短引用，会自动添加引号，一般用于引用较短的内容，与
<blockquote>不同，它是内联元素。 -
<code>：用于显示计算机代码，一般使用等宽字体显示，以便于区分代码和普通文本。
-
<kbd>：用于表示用户输入的键盘按键，通常会有特殊的样式，如边框、背景色等，以突出显示键盘输入。
列表标签
- <ul>：无序列表，通常与
<li>元素一起使用，列表项使用项目符号表示。 - <ol>：有序列表，通常与
<li>元素一起使用，列表项使用数字或字母等进行编号。 - <li>：用于定义列表项，放在
<ul>或<ol>内部。 - <dl>：定义列表，通常包含
<dt>（定义术语）和<dd>（定义描述）元素，用于创建术语及其定义的列表。 - <dt>：用于定义列表中的术语部分，放在
<dl>内部。 - <dd>：用于定义列表中术语的解释或描述部分，放在
<dl>内部。
媒体标签
- <img>：用于显示图片资源，通过
src属性指定图片的来源，alt属性提供替代文本，当图片无法显示时会显示该文本。 - <audio>：用于播放音频文件，可使用
src属性指定音频文件的来源，支持多种音频格式。（H5） - <video>：用于播放视频文件，通过
src属性指定视频文件的来源，支持多种视频格式，还可以添加控制条、设置自动播放等。（H5） - <embed>：用于嵌入外部内容，如多媒体文件（音频、视频、插件等），可通过
src属性指定源文件，不同的浏览器可能对不同的嵌入内容有不同的支持。 - <object>：可用于嵌入对象，如 Flash 动画、PDF 文件等，比
<embed>更通用，可包含备用内容，当无法显示嵌入对象时会显示备用内容。
链接标签
- <a>：用于创建超链接，通过
href属性指定链接的目标地址，可以是另一个网页、页面内的锚点、文件等，target属性可指定链接打开的方式，如在新窗口中打开。
语意标签
- <time>：用于表示日期或时间，有助于机器阅读。（H5）
- <mark>：用于突出显示文本中的部分内容，默认显示为带有背景色的标记。（H5）
- <small>：用于显示较小的文本，通常用于显示版权信息、注释等不太重要的文本。
- <cite>：用于引用作品的标题，如书籍、电影、歌曲等的标题。
- <col>：用于为表格中的列定义属性，通常在
<colgroup>中使用，可用于设置列的样式、宽度等。 - <colgroup>：用于对表格中的列进行分组，可包含一个或多个
<col>元素，方便对列进行统一的样式设置和属性定义。 - <dialog>：用于创建对话框或弹出窗口，可包含交互元素，是 HTML5 中新增的元素，可通过 JavaScript 进行控制，如打开、关闭等操作。
- <meter>：用于显示一个已知范围的标量测量，例如磁盘使用量、进度条等，可设置
min、max、value等属性来表示测量的范围和当前值。 - <details>：是 HTML5 中的元素，用于创建一个可展开和收起的小部件，可包含额外的详细信息。用户点击元素时，可以展开或收起
<details>元素中包含的内容。(H5) - <summary>：通常和
<details>元素一起使用（未提及，但与之相关），用于为<details>元素提供一个摘要或标题，用户点击可展开或收起<details>中的内容。(H5) - <pre>：用于预格式化文本，保留文本中的空格和换行符，通常用于显示代码块或其他需要保持格式的文本。
表格标签
-
<caption>：通常和
<table>一起使用，为表格提供标题，放置在<table>内部，在表格的顶部显示，提供表格的说明信息。 -
<table>：用于创建表格，包含表格的结构。
-
<thead>：表示表格的表头部分，通常包含
<th>元素。 -
<tbody>：表示表格的主体部分，通常包含
<tr>和<td>元素。 -
<tfoot>：表示表格的表尾部分，通常包含
<th>或<td>元素。 -
<tr>：表示表格中的一行，包含一个或多个
<td>或<th>元素。 -
<th>：表示表头单元格，通常位于
<thead>或<tfoot>中，显示列或行的标题。 -
<td>：表示表格中的数据单元格，通常位于
<tbody>中，包含表格的数据。
其他标签
- <meter>：已知范围的标量值或者分数值。(H5)
- <progress>：进度条。(H5)
- <hr>：水平分割线
- <br>：换行
转义符
：表示一个不间断空格，防止文本在该位置换行。>：表示大于号>。<：表示小于号<。©：表示版权符号©。&：表示和号&。"：表示双引号"。'：表示单引号'。¢：表示美分符号¢。£：表示英镑符号£。¥：表示日元符号¥。
结语
在实际的网页开发过程中，许多开发者常常倾向于使用 <div> 标签来完成页面布局，甚至出现了几乎用 <div> 标签来实现所有布局需求的情况，可谓是 “一个 <div> 标签走天下”。然而，从网页结构优化和可维护性的角度来看，这种做法并非最佳选择。
虽然 <div> 标签具有很强的通用性，可灵活应用于各种布局场景，但为了提升网页的语义化程度，还是强烈建议开发者更多地使用语义化标签。语义化标签是 HTML5 中引入的一系列具有明确含义的标签，如 <header>、<nav>、<main>、<article>、<section>、<aside>、<footer> 等。这些标签能够更准确地描述页面的不同部分，使网页结构更加清晰，有助于搜索引擎优化（SEO），同时也方便了开发人员对页面的维护和代码的阅读。例如，使用 <header> 来表示页面的头部区域，<nav> 来构建导航栏，<article> 用于文章内容的包裹，<aside> 展示侧边栏信息，<footer> 用于页面的底部信息。这样的做法能够让网页结构更加直观，不仅利于开发者自身理解页面结构，也便于搜索引擎和辅助技术更好地理解页面的内容和布局，从而为用户提供更好的体验。因此，尽管使用 <div> 标签可以快速实现布局，但使用语义化标签能让网页开发更加规范和高效。
