HTML 块级元素和内联元素
每个 HTML 元素都有一个默认的显示值，这取决于它是什么类型的元素。
最常见的两个显示值是 block 和 inline。
块级元素
块级元素总是从新的一行开始，浏览器会在元素前后自动添加一些空白（边距）。
块级元素总是占用可用的全部宽度（向左和向右尽可能地伸展）。
两个常用的块级元素是：<p> 和 <div>。
<p> 元素在 HTML 文档中定义一个段落。
<div> 元素在 HTML 文档中定义一个划分或一个部分。
<p> 元素是一个块级元素。
<div> 元素是一个块级元素。以下是 HTML 中的块级元素
内联元素
内联元素不会从新的一行开始。
内联元素只占用必要的宽度。
这是 一个在段落中的 <span> 元素。
以下是 HTML 中的内联元素
注意： 内联元素不能包含块级元素！
<div> 元素
<div> 元素通常用作其他 HTML 元素的容器。
<div> 元素没有必需的属性，但style、class 和id 是常见的。
与 CSS 一起使用时，<div> 元素可以用来对内容块进行样式化
示例
<div style="background-color:black;color:white;padding:20px;">
<h2>伦敦</h2>
<p>伦敦是英格兰的首都。它是英国人口最多的城市，大都市区有超过 1300 万居民。</p>
</div>
尝试一下 »
你将在下一章中更多地了解 <div> 元素。
<span> 元素
<span> 元素是一个内联容器，用于标记文本的一部分或文档的一部分。
<span> 元素没有必需的属性，但style、class 和id 是常见的。
与 CSS 一起使用时，<span> 元素可以用来对文本的部分进行样式化
示例
<p>我的母亲有 <span style="color:blue;font-weight:bold;">蓝色</span> 眼睛，而我的父亲有 <span style="color:darkolivegreen;font-weight:bold;">深绿色</span> 眼睛。</p>
尝试一下 »
章节总结
- 块级元素总是从新的一行开始，并占用可用的全部宽度
- 内联元素不会从新的一行开始，它只占用必要的宽度
<div>元素是一个块级元素，通常用作其他 HTML 元素的容器<span>元素是一个内联容器，用于标记文本的一部分或文档的一部分
HTML 标签
| 标签 | 描述 |
|---|---|
| <div> | 在文档中定义一个部分（块级） |
| <span> | 在文档中定义一个部分（内联） |
有关所有可用 HTML 标签的完整列表，请访问我们的 HTML 标签参考。
视频：HTML 块级和内联
