HTML <p> 标签

HTML <p>元素(或者说 HTML 段落元素)表示文本的一个段落。该元素通常表现为一整块与相邻文本分离的文本,或以垂直的空白隔离或以首行缩进。另外,<p> 是块级元素。


实例

以下代码标记了一个段落:

  1. <html>
  2. <body>
  3. <p>这是段落。</p>
  4. <p>这是段落。</p>
  5. <p>这是段落。</p>
  6. <p>段落元素由 p 标签定义。</p>
  7. </body>
  8. </html>

浏览器支持

元素
<p>YesYesYesYesYes

所有主流浏览器都支持 <p> 标签。


定义和用法

<p> 标签定义段落。

p 元素会自动在其前后创建一些空白。浏览器会自动添加这些空间,您也可以在样式表中规定。


HTML 与 XHTML 之间的差异

在 HTML 4.01 中,所有 p 元素的呈现属性均不建议使用。

在 XHTML 1.0 Strict DTD 中,所有 p 元素的呈现属性均不支持。


可选的属性

属性描述
align
  • left
  • right
  • center
  • justify

不建议使用。请使用样式取代它。

规定段落中文本的对齐方式。


全局属性

<p> 标签支持 HTML 中的 全局属性


事件属性

<p> 标签支持 HTML 中的 事件属性


延伸阅读:允许的段落用法

可以只在块(block)内指定段落,也可以把段落和其他段落、列表、表单和预定义格式的文本一起使用。总的来讲,这意味着段落可以在任何有合适的文本流的地方出现,例如文档的主体中、列表的元素里,等等。

从技术角度将,段落不可以出现在头部、锚或者其他严格要求内容必须只能是文本的地方。实际上,多数浏览器都忽略了这个限制,它们会把段落作为所含元素的内容一起格式化。


更多实例

段落的更多样式例子

  1. <html>
  2. <head>
  3. <style>
  4. p {
  5. color: navy;
  6. text-indent: 30px;
  7. text-transform: uppercase;
  8. }
  9. </style>
  10. </head>
  11. <body>
  12. <p>Lorem ipsum从西元15世纪开始就被广泛地使用在西方的印刷、设计领域中,在电脑排版盛行之后,这段被传统印刷产业使用几百年的无意义文字又再度流行。由于这段文字以“Lorem ipsum”起头,并且常被用于标题的测试中,所以一般称为Lorem ipsum,简称为Lipsum。</p>
  13. </body>
  14. </html>
  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  4. <p>
  5. 我的邦妮躺在海上。
  6. 我的邦妮躺在海上。
  7. 我的邦妮躺在海上。
  8. 哦,把我的邦妮还给我。
  9. </p>
  10. <p>请注意,在p标签内浏览器会忽略换行符</p>
  11. </body>
  12. </html>

p标签的默认样式

  1. p {
  2. display: block;
  3. margin-top: 1em;
  4. margin-bottom: 1em;
  5. margin-left: 0;
  6. margin-right: 0;
  7. }