block 的中文含义与用法详解

什么是 block？

在 CSS 中，display: block 是一种常见的显示类型，用于将元素设置为“块级元素”。 “block”的中文通常翻译为“块”或“区块”，表示该元素会独占一行，并在其前后产生换行。

block 元素的特点

• 默认占据父容器的全部宽度（即使内容很少）。
• 可以设置 width、height、padding、margin 等盒模型属性。
• 多个 block 元素会垂直堆叠，不会在同一行显示。
• 常见的原生 block 元素包括：<div>、<p>、<h1>～<h6>、<ul>、<li> 等。

如何使用 display: block？

即使某些元素默认不是 block（如 <span>），也可以通过 CSS 强制设为 block：

span {
  display: block;
}

这样，原本内联的 <span> 就会表现为块级元素。

常见应用场景

• 布局结构：使用 <div> 构建页面区块。
• 导航菜单：将 <a> 标签设为 block 以撑满容器。
• 清除浮动：有时通过 block + clear 实现布局修复。