HTML 常用标签分类
1 <html> 标签
HTML 文档 的 根标签，它包裹着 整个 HTML 文档的 内容。所有其他的 HTML 标签 都应该 在这个标签 内部。
<html>
<head>...</head>
<body>...</body>
</html>
2 <head> 标签
包含 文档的 元数据，如 文档标题、样式表引用、脚本引用 等。
这些信息 通常 不会直接显示 在 网页内容中，但对于 浏览器 和 搜索引擎 等 有重要作用。
<head>
<title>我的网页</title>
<link rel="stylesheet" href="styles.css">
<script src="script.js"></script>
</head>
3 body 标签
包含了网页中 所有要在 浏览器 中显示的 内容，如 文本、图像、链接、表格等。
<body>
<h1>欢迎来到我的网页</h1>
<p>这是一段介绍网页内容的段落。</p>
</body>
4 <h1>-<h6> 标签
用于 定义标题，<h1> 是 最高级别的 标题，<h6> 是 最低级别的 标题。标题标签 在网页中 用于突出显示 重要的 文本内容，并且在 搜索引擎优化（SEO）方面 也有一定的作用，因为 搜索引擎 会根据 标题标签 来理解 网页内容的 层次结构。
<h1>一级标题</h1>
<h2>二级标题</h2>
5 <p> 标签
定义一个段落。浏览器会 自动 在 段落之间 添加一些 空白间距，使 文本排版 更加清晰。
6 <a> 标签
用于 创建 超链接。可以链接到 其他网页、同一网页的 其他部分、文件下载 等。通过设置 href 属性 来指定 链接的 目标地址。
<a href="https://www.example.com">访问示例网站</a>
7 <img> 标签
在网页中 插入图像。通过 src 属性 指定图像的 源文件路径，还可以设置 alt 属性 来提供图像的 替代文本，当图像 无法显示时，浏览器会显示 替代文本，并且对于 搜索引擎 和 屏幕阅读器 等工具也很有用。
<img src="image.jpg" alt="这是一张美丽的风景图">
8 <ul> 和 <ol> 标签（以及 <li> 标签）
<ul> 用于创建 无序列表，<ol> 用于创建 有序列表。列表中的 每个项目 都用 <li> 标签 定义。
<!--无序列表-->
<ul>
<li>苹果</li>
<li>香蕉</li>
<li>橙子</li>
</ul>
<!--有序列表-->
<ol>
<li>苹果</li>
<li>香蕉</li>
<li>橙子</li>
</ol>
9 <table>、<tr>、<td> 标签（以及 <th> 标签）
<table> 用于 定义表格，<tr> 定义 表格中的 行，<td> 定义 表格中的 单元格。<th> 用于定义 表头单元格，通常会以 加粗 或 其他突出显示的 方式 呈现。
<!--表格-->
<table>
<!--表格行-->
<tr>
<!--表头单元格-->
<th>姓名</th>
<th>年龄</th>
</tr>
<!--表格行-->
<tr>
<!--表格单元格-->
<td>张三</td>
<td>20</td>
</tr>
</table>
10 <div> 和 <span> 标签
<div> 是一个 块级元素，用于 划分 网页中的 区域，通常 用于布局。
<span>是一个 内联元素，用于对 文本 等内联内容 进行 小范围的 样式应用 或 标记。
html
<!--div 划分区域-->
<div style="background-color: lightgray; padding: 10px;">
<p>这是一个被<div>包裹的段落。</p>
</div>
<!--span 小范围样式应用-->
<p>这是一段包含<span style="color: red;">红色文字</span>的段落。</p>
