：段落元素Baseline Widely availableThis feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Learn moreSee full compatibilityReport feedback

HTML 元素表示文本的一个段落。在视觉媒体中，段落通常表现为用空行和/或首行缩进与相邻段落分隔的文本块，但 HTML 段落可以是相关内容的任何结构分组，如图像或表格字段。

段落是块级元素，如果在关闭的

标签之前解析了另一个块级元素，则该标签将自动关闭。请参阅下面的“标签省略”。

尝试一下

Geckos are a group of usually small, usually nocturnal lizards. They are found

on every continent except Antarctica.

Some species live in houses where they hunt insects attracted by artificial

light.

p {

margin: 10px 0;

padding: 5px;

border: 1px solid #999;

}

属性这个元素包含全局属性。

备注：

标签的 align 属性已被弃用，请不要使用。

示例HTMLhtml

这是第一个段落。这是第一个段落。这是第一个段落。这是第一个段落。

这是第二个段落。这是第二个段落。这是第二个段落。这是第二个段落。

结果为段落添加样式默认情况下，浏览器会用一个空行来分隔段落。其他分隔方法，如首行缩进，可以通过 CSS 来实现：

HTMLhtml

用空行分隔段落最便于读者扫描，但也可以通过缩进首行来分隔段落。这样做通常是为了减少所占空间，例如节省印刷用纸。

学校试卷和草稿等需要编辑的写作，会同时使用空行和缩进进行分隔。在完成的作品中，将两者结合起来会被认为是多余和业余的。

在非常古老的文字中，段落之间用一种特殊的字符：¶（称为段落符号）分隔。如今，这个符号太密集了，难以阅读。

究竟有多难阅读？自己试一下：

使用段落符号分隔段落

CSScssp {

margin: 0;

text-indent: 3ch;

}

p.pilcrow {

text-indent: 0;

display: inline;

}

p.pilcrow + p.pilcrow::before {

content: " ¶ ";

}

JavaScriptjsdocument.querySelector("button").addEventListener("click", (event) => {

document.querySelectorAll("p").forEach((paragraph) => {

paragraph.classList.toggle("pilcrow");

});

[event.target.innerText, event.target.dataset.toggleText] = [

event.target.dataset.toggleText,

event.target.innerText,

];

});

结果无障碍考虑将内容分成段落有助于使页面更易于访问。屏幕阅读器和其他辅助技术提供的快捷方式可以让用户跳到下一个或上一个段落，让他们可以略读内容，就像留白可以让视觉用户跳来跳去一样。

使用空的

元素在段落之间添加空格，对于使用读屏技术浏览的人来说是有问题的。屏幕阅读器可能会显示段落的存在，但不会显示其中包含的任何内容——因为没有内容。这会让使用屏幕阅读器的人感到困惑和沮丧。

如果需要额外的空间，可以使用 CSS 属性，如 margin 来创建效果：

cssp {

margin-bottom: 2em; /* 增加段落之后的空白 */

}

技术概要

内容分类

流式内容、可感知内容。

允许的内容

短语内容。

标签省略

开始标签是必要的。如果

元素后面紧跟

、

、