第一节 块元素
块元素通常用于组织和布局页面的主要结构和内容，如：段落，标题，列表，表格等。它们用于创建页面的主要部分，将内容分隔成逻辑块
- 块级元素通常会从新的行开始，并占据整行的宽度，因此他们会在页面上呈现为一块独立的内容块。
- 可以包含其他块级元素和行内元素。
- 常见的块级元素包括"<div>','<p>',到'<h6>','<ul>','<ol>','<li>','<table>','<form>'等。
第二节 行内元素
行内元素通常用于添加文本样式或为文本中的一部分应用样式。它们可以在文本中插入小的元素，强调文本等。
- 行内元素通常在同一行内呈现，不会独占一行。
- 它们只占据其内容所需的宽度，而不是整行的宽度。
- 行内元素不能包含块级元素，但可以包含其他行内元素。
- 常见的行内元素包括"<span>","<a>","<strong>","<em>",'<img>',"<br>","<input>"等。
第三节 练习代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HTML区域</title>
</head>
<body>
<div class="nav">
<a href = "#">链接1</a>
<a href = "#">链接2</a>
<a href = "#">链接3</a>
<a href = "#">链接4</a>
</div>
<div class="content">
<h1>文章标题</h1>
<p>文章内容</p>
<p>文章内容</p>
<p>文章内容</p>
<p>文章内容</p>
</div>
<span> 这是第1个span标签</span>
<span> 这是第2个span标签</span>
<span> 这是第3个span标签</span>
<span> 这是第4个span标签</span>
<hr>
<span>链接点击这里 <a href = "#">链接</a></span>
</body>
</html>
第四节 显示结果
