HTML 元素
在学习 HTML 5 时，你需要了解最基本的构建模块 —— HTML 元素（HTML Elements）。HTML 元素是网页的组成部分，浏览器通过这些元素来解析和渲染页面内容。
本节将带你了解什么是 HTML 元素、元素的语法结构，以及各种类型的元素。
什么是 HTML 元素？
一个 HTML 元素通常由以下几个部分组成：
- 起始标签（Start tag）
- 内容（Content）
- 结束标签（End tag）
举个例子：
<p>这是一个段落。</p>
这里的 <p> 是开始标签，</p> 是结束标签，而“这是一个段落。”是元素的内容。HTML元素可以嵌套，也就是说一个元素可以包含其他元素。
你可以把它理解成一个盒子：标签是盒子的边界，内容就是盒子里面的东西。
HTML 元素 vs HTML 标签
HTML 标签 是围绕内容的标识符，比如 <h1> 和 </h1>，而 HTML 元素 是“标签 + 内容”的整体。
来看一个例子：
<h1>主标题</h1>
<h1>是开始标签主标题是元素的内容</h1>是结束标签- 整个
<h1>主标题</h1>才是一个 HTML 元素
空元素（Empty Elements）
某些 HTML 元素是空的，它们不包含任何内容。最常见的空元素包括：
<br>
<img src="image.jpg" alt="描述文本">
这些元素不需要结束标签，在 HTML5 中也不要求加 /。虽然你可能在一些旧代码中看到 <br /> 这样的写法，但推荐你使用简洁的 <br>。
嵌套 HTML 元素
你可以将一个 HTML 元素嵌套在另一个元素中。比如：
<p>这是 <strong>加粗</strong> 的文字。</p>
在这个例子中，<strong> 是嵌套在 <p> 中的。请注意：元素必须正确嵌套，不能交叉嵌套，否则浏览器可能无法正确解析。
正确嵌套的例子：
<b><i>文字</i></b>
错误嵌套的例子（不要这样写）：
<b><i>文字</b></i>
所有 HTML 文档的结构
一个完整的 HTML5 文档中，元素是嵌套结构，页面内容都包裹在一些必需的元素中：
<!DOCTYPE html>
<html>
<head>
<title>页面标题</title>
</head>
<body>
<h1>我的第一个标题</h1>
<p>我的第一个段落。</p>
</body>
</html>
元素说明：
<html>是整个页面的根元素<head>中包含页面的元信息<title>设置网页标题<body>包含了网页的可见部分
你在编写 HTML 页面时，必须遵循这种结构。
不同类型的 HTML 元素
HTML 元素有很多种，用途也各不相同。常见的元素包括：
- 标题元素：
<h1>到<h6>，用来定义从大到小的标题 - 段落元素：
<p>，用来定义段落 - 链接元素：
<a>，用来添加超链接 - 图像元素：
<img>，用来插入图片 - 列表元素：
<ul>、<ol>、<li>，用来创建列表 - 表格元素：
<table>、<tr>、<td>等
HTML 中的空格和换行
HTML 会自动忽略你在代码中多余的空格和换行。例如：
<p>这是
一个
段落。</p>
浏览器会把它显示成：
这是 一个 段落。
如果你想强制换行或添加额外空格，可以使用：
- 换行：
<br> - 空格：
（非断行空格）
小结
HTML 元素是网页的核心组成部分，由标签和内容构成。你已经了解了元素的结构、分类、嵌套规则及其在浏览器中的表现。掌握这些基础之后，你就能更自信地构建 HTML 页面，并为后续的 CSS 和 JavaScript 学习打下坚实基础。
