html - 显示 :block? 的 div 和 span 有什么区别

Question

既然 span 可以有 display:block，我什么时候应该使用它而不是 div？

Answer 1

技术上的区别在于 div 是 block 级元素，而 span 是用于文本的内联元素。虽然 span 可以显示并且表现得像 block 元素，但本质上它们仍然被视为内联元素，因此不能将 block 元素作为有效的 HTML 包含。

div 可以包含 span，但 span 不能有效包含 div，即使您应用 display : block 或 display: inline 所有这些。

正如其他人提到的，您使用 div 作为构建 block 来定义页面的布局和结构，同时您使用 span 来包装部分文本，用于样式或结构目的。

HTML 规范的一些链接:

div – 通用流容器

Permitted contents

Zero or more style elements, followed by flow content.

...其中流内容由短语内容和许多 block 级元素(流元素)组成。

span – 通用跨度

Permitted contents

Phrasing content.

...其中短语内容由文本和内联元素组成。