Block Format 使用指南

什么是 Block Format？

在 HTML 和 CSS 中，block format（块级格式）指的是元素以“块”形式呈现的布局方式。 块级元素（如 <div>、<p>、<h1> 等）默认独占一行， 并在其前后产生换行。

CSS 中的 display: block

通过设置 display: block;，可将任何元素（包括原本是行内元素的 <span>）转为块级元素。

span.block-example {
  display: block;
  background-color: #eef;
  padding: 10px;
}

这样设置后，该 <span> 将像 <div> 一样占据整行。

常见块级元素

以下 HTML 元素默认具有块级格式：

• <div>
• <p>
• <h1> 到 <h6>
• <ul>, <ol>, <li>
• <section>, <article>, <header> 等语义化标签

应用场景

块级格式广泛用于：

• 网页整体布局（如侧边栏、主内容区）
• 段落文本排版
• 创建独立的容器区块
• 控制元素尺寸（宽度、高度、外边距等）