块级元素

HTML(超文本标记语言)中元素大多数都是“块级”元素或行内元素。块级元素占据其父元素(容器)的整个水平空间,垂直空间等于其内容高度,因此创建了一个“块”。这篇文章帮助解释这个概念。

通常浏览器会在块级元素前后另起一个新行。下面的例子表明了块级元素的作用:

块级元素示例

HTML

<p>This paragraph is a block-level element; its background has been colored to display the paragraph's parent element.</p>

CSS

p { background-color: #8ABB55; }

用法

  • 块级元素只能出现在 <body> 元素内。

块级元素与行内元素

块级元素与行内元素有几个关键区别:

格式

默认情况下,块级元素会新起一行。

内容模型

一般块级元素可以包含行内元素和其他块级元素。这种结构上的包含继承区别可以使块级元素创建比行内元素更”大型“的结构。

HTML 标准中块级元素和行内元素的区别至高出现在 4.01 标准中。在 HTML5,这种区别被一个更复杂的内容类别 (en-US)代替。”块级“类别大致相当于 HTML5 中的流内容 (en-US)类别,而”行内“类别相当于 HTML5 中的措辞内容 (en-US)类别,不过除了这两个还有其他类别。

元素列表

以下是 HTML 中所有的块级元素列表(虽然”块级“在新的 HTML5 元素中没有明确定义)

<address>

联系方式信息。

<article>

文章内容。

<aside>

伴随内容。

<blockquote>

块引用。

<dd>

定义列表中定义条目描述。

<div>

文档分区。

<dl>

定义列表。

<fieldset>

表单元素分组。

<figcaption>

图文信息组标题

<figure>

图文信息组 (参照 <figcaption>)。

区段尾或页尾。

<form>

表单。

<h1> (en-US), <h2> (en-US), <h3> (en-US), <h4> (en-US), <h5> (en-US), <h6> (en-US)

标题级别 1-6.

区段头或页头。

<hgroup>

标题组。

<hr>

水平分割线。

<ol>

有序列表。

<p>

行。

<pre>

预格式化文本。

<section>

一个页面区段。

<table>

表格。

<ul>

无序列表。

另请参阅