HTML段落

HTML 的 <p> 标签用于创建段落。例如：

<p>HTML is fun to learn.</p>

浏览器输出

正如我们所见，段落以 <p> 开始，以 </p> 结束。

HTML 段落总是从新的一行开始。为了演示这一点，让我们创建一个包含两个段落的网页。

<p>Paragraph 1: Short Paragraph</p>

<p>Paragraph 2: Long Paragraph, this is a long paragraph with more text to fill an entire line in the website.</p>

浏览器输出

上面的 HTML 代码包含两个段落。即使第一个段落之后有足够的空间，每个段落也从新的一行开始。

注意： 默认情况下，浏览器会自动在段落的上方和下方添加空白（外边距）。可以使用 CSS 更改空白和其他设计方面。

HTML 段落和空格

段落会自动删除我们文本中多余的空格和换行符。例如：

<p>
The paragraph tag removes      all extra spaces.
  
The paragraph tag also removes all extra lines.
</p>

浏览器输出

此处，输出

• 删除单词之间所有多余的空格
• 删除句子之间多余的换行符

注意： HTML 中可以添加额外的空格和换行符，我们将在本教程后面讨论。

在段落中添加换行符

我们可以在段落中使用HTML 换行标签 <br> 来添加换行符。例如：

<p>We can use the <br> HTML br tag <br> to add a line break.</p>

浏览器输出

HTML 中的预格式化文本

正如我们已经讨论过的，段落无法保留多余的换行符和空格。如果我们需要创建使用多个空格和换行符的内容，我们可以使用HTML<pre>标签。

<pre> 标签创建预格式化文本。预格式化文本将按 HTML 文件中的书写方式显示。例如：

<pre>
  This text  
    will be 
      displayed
      
      in the same manner 
        as it is written
</pre>

浏览器输出

段落内的其他元素

可以在一个 HTML 元素内包含另一个 HTML 元素。对于 <p> 标签也是如此。例如：

<p>
We can use other tags like <strong>the strong tag to emphasize text</strong>
</p>

浏览器输出

在上面的示例中，我们在 <p> 标签内使用了 <strong> 标签。

浏览器会自动将 <strong> 标签内的内容加粗显示。

段落是块级元素

<p> 标签是块级元素。它在新的一行开始，并占据（其父元素的）全部宽度。

注意： 请注意哪些元素是内联元素，哪些是块级元素。这在以后学习 CSS 时很重要。

在段落中添加额外的空格

如前所述，我们通常无法在段落中添加额外的空空格。但是，我们可以使用一种称为不换行空格的 HTML 实体来添加额外的空格。例如：

<p>Extra space &nbsp;&nbsp; inside a paragraph</p>

浏览器输出

这里，  是一个HTML 实体，它被浏览器解释为空格。这使我们可以在段落和其他 HTML 标签内创建多个空格。