HTML 元素以开始标签起始，以结束标签终止。完整标签是<></>，元素的内容是开始标签与结束标签之间的内容。
一、HTML 元素的嵌套
大多数 HTML 元素可以嵌套（HTML 元素可以包含其他 HTML 元素）。
<html>
<body><div>这里是内容</div>
</body>
</html>HTML 文档由相互嵌套的 HTML 元素构成。
二、标签要完整
HTML 元素由<></>标签为开始和结束，但是即使忘记了使用结束标签，大多数浏览器也会正确地显示 HTML：
<p>这是一个段落
<p>这是一个段落以上实例在浏览器中也能正常显示，因为关闭标签是可选的。
但不要依赖这种做法。忘记使用结束标签会产生不可预料的结果或错误。
三、HTML 空元素
没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的。
<br> 就是没有关闭标签的空元素（<br> 标签定义换行）。
在 XHTML、XML 以及未来版本的 HTML 中，所有元素都必须被关闭。
在开始标签中添加斜杠，比如 <br />，是关闭空元素的正确方法，HTML、XHTML 和 XML 都接受这种方式。
即使 <br> 在所有浏览器中都是有效的，但使用 <br /> 其实是更长远的保障。
四、HTML 提示：使用小写标签
HTML 标签对大小写不敏感：<P> 等同于 <p>。许多网站都使用大写的 HTML 标签。
HTML元素可以按照不同的用途和功能进行分类。以下是常见的HTML元素分类及其用途：
1. 文档结构元素
用于定义网页的基本结构和布局。
<html>：整个HTML文档的根元素。
<head>：包含文档元数据（如标题、字符编码、外部资源链接等）。
<title>：定义网页的标题，显示在浏览器标签上。
<body>：包含可见的页面内容（文本、图像、链接等）。
<header>：通常包含导航栏、标题或介绍性内容。
<nav>：定义导航链接集合。
<main>：包含文档的主要内容（每个文档只能有一个）。
<footer>：通常包含版权信息、联系方式或相关链接。
<section>：定义文档中的一个章节或区域。
<article>：定义独立的、自包含的内容（如博客文章、评论）。
<aside>：定义与主要内容相关的侧边栏或补充信息。
2. 文本格式化元素
用于定义文本的结构和格式。
- 标题：<h1>~<h6>（从主标题到子标题）。
- 段落：<p>。
- 强调：
<em>：表示强调（通常斜体）。
<strong>：表示重要性（通常加粗）。
- 引用：
<blockquote>：长引用（块级）。
<q>：短引用（行内）。
<cite>：引用作品标题（如书籍、电影）。
- 代码：
<code>：表示计算机代码。
<pre>：保留预格式化文本（通常用于代码块）。
- 其他：
<mark>：高亮显示文本。
<small>：次要文本（如免责声明）。
<del>：删除的文本（带删除线）。
<ins>：插入的文本（带下划线）。
<sub>/<sup>：下标/上标文本。
3. 链接与锚点
用于创建页面内或页面间的链接。
<a>：定义超链接。
href：目标URL。
target：指定打开方式（如_blank在新窗口打开）。
- 锚点：通过id属性创建页面内跳转点（如<a href="#section2">跳转到第二节</a>）。
4. 列表元素
用于组织信息列表。
- 无序列表：<ul>（使用圆点或其他符号）。
- 有序列表：<ol>（使用数字或字母）。
- 列表项：<li>。
- 定义列表：
<dl>：定义列表容器。
<dt>：定义术语。
<dd>：定义术语的描述。
5. 媒体元素
用于嵌入图像、音频、视频等多媒体内容。
- 图像：
<img>：显示图像（需设置src和alt属性）。
<figure>：包含图像及其说明（如标题）。
<figcaption>：图像的标题或说明。
- 音频/视频：
<audio>：嵌入音频（支持controls显示播放控件）。
<video>：嵌入视频（支持controls、width、height等属性）。
<source>：为媒体元素指定多个资源（如不同格式的视频）。
- 嵌入内容：
<iframe>：嵌入另一个网页。
<embed>：嵌入外部应用或插件（如PDF、Flash）。
<object>：嵌入各种资源（类似<embed>，但功能更强大）。
6. 表单元素
用于创建用户输入表单。
- 表单容器：<form>（需设置action和method属性）。
- 输入字段：
<input>：多功能输入框（通过type属性控制类型）。
- 常见类型：text、password、number、email、checkbox、radio、file、submit、reset等。
<textarea>：多行文本输入。
<select>：下拉选择框。
<option>：下拉选项（嵌套在<select>中）。
<optgroup>：选项分组。
- 表单标签：<label>（关联输入元素，提高可访问性）。
- 按钮：<button>（可作为提交、重置或自定义按钮）。
- 表单分组：<fieldset>（将相关表单元素分组）和<legend>（组标题）。
7. 表格元素
用于展示结构化数据。
- 表格容器：<table>。
- 表头：<th>（表头单元格）。
- 表体：
<tr>：表格行。
<td>：表格单元格。
- 表结构：
<thead>：表头区域。
<tbody>：表体区域。
<tfoot>：表脚区域（通常用于汇总）。
- 合并单元格：通过rowspan和colspan属性。
8. 内联语义元素
提供额外的文本语义。
<span>：通用内联容器（用于样式或脚本）。
<br>：换行符。
<wbr>：可选换行点（允许文本在适当位置换行）。
<i>：斜体文本（通常用于术语、外语等）。
<b>：加粗文本（不强调重要性）。
<u>：下划线文本（通常用于专有名词）。
<s>：删除线文本（表示不准确或不再相关）。
9. 元数据元素
提供关于文档的信息（不直接显示）。
<meta>：定义字符编码、页面描述、关键词等。
- 示例：<meta charset="UTF-8">、<meta name="description" content="网页描述">。
<link>：引入外部资源（如CSS、图标）。
<style>：定义内联CSS样式。
<script>：嵌入或引用JavaScript代码。
10. 交互元素
提供用户交互功能。
<details>：可折叠的信息面板。
<summary>：<details>的标题（点击展开/折叠）。
<dialog>：对话框或模态窗口。
<progress>：显示任务进度（如文件上传）。
<meter>：显示已知范围的度量值（如磁盘使用情况）。
11. 语义化空白元素
用于布局和对齐。
<div>：通用块级容器（用于布局）。
<span>：通用内联容器（用于样式或脚本）。
12. 无障碍元素
提高网页的可访问性。
<aria-*>：ARIA属性（辅助技术使用，如aria-label、aria-describedby）。
<role>：定义元素的角色（如role="button"）。
13. 其他元素
<canvas>：通过脚本绘制图形（如图表、游戏）。
<svg>：嵌入可缩放矢量图形。
<noscript>：当浏览器不支持JavaScript时显示的内容。
总结
HTML元素的分类有助于理解其用途和语义，合理使用这些元素可以提高代码的可读性、可维护性和搜索引擎优化（SEO）效果。现代HTML（HTML5）更强调语义化，例如使用<header>、<nav>、<main>代替无意义的<div>，使代码更具描述性。
![Shell脚本之 “[]“ 详解](http://pic.xiahunao.cn/nshx/Shell脚本之 “[]“ 详解)
