在 HTML 中，块级元素（Block-level element）和内联元素（Inline element）是两种不同类型元素，它们在页面布局和样式应用方面有不同的行为和特性。
块级元素（Block-level element）
块级元素在页面布局中会独占一行，它会从新的一行开始，并且其后的元素也会从新的一行开始。块级元素可以设置宽度（width）、高度（height）等尺寸属性 ，并且其内部可以包含内联元素或其他块级元素。
常见的块级元素包括：
<div>：用于定义文档中的分区或块
<p>：用于定义段落
<h1>-<h6>：用于定义标题
<ul>、<ol>、<li>：用于定义列表
<table>：用于定义表格
<form>：用于定义表单
内联元素（Inline element）
**内联元素在页面布局中不会独占一行，它会与其他元素在同一行显示，直到遇到块级元素或者页面的边界。**内联元素只能包含文本或者其他内联元素，不能设置宽度和高度等尺寸属性。
常见的内联元素包括：
<span>：用于定义文档中的行内分区
<a>：用于定义超链接
<img>：用于定义图像
<strong>：用于定义粗体文本
<em>：用于定义强调文本
<b>：用于定义粗体文本（不带有强调的语义）
<i>：用于定义斜体文本
区别
显示方式：
块级元素独占一行，内联元素与其他元素在同一行显示。
块级元素可以设置宽度和高度，内联元素不能设置宽度和高度。
包含内容：
块级元素可以包含内联元素或其他块级元素。
内联元素只能包含文本或其他内联元素。
默认行为：
块级元素默认情况下会从新的一行开始，并且其后的元素也会从新的一行开始。
内联元素默认情况下会与其他元素在同一行显示。
示例
html
<!-- 块级元素示例 -->
<div>
这是一个块级元素
</div>
<p>
这是一个段落元素，也是块级元素
</p>
<!-- 内联元素示例 -->
<span>
这是一个内联元素
</span>
<a href="https://www.example.com">
这是一个超链接，也是内联元素
</a>在实际开发中，可以通过 CSS 来改变元素的显示类型，例如将内联元素设置为块级元素，或者将块级元素设置为内联元素，从而实现不同的布局效果。
