HTML P段落和换行符

在本教程中，您将学习如何在 HTML 中创建段落。文章主要包括以下几个知识点：创建段落、关闭段落元素、创建换行符、创建水平线条hr、管理空白和pre定义预格式化文本。

创建段落

段落元素用于在网页上发布文本。

段落是用标签定义的。段落P标签是一个非常基本的标签，通常是您在网页上发布文本所需的第一个标签。这是一个例子：

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

注意：浏览器内置样式表会自动在段落内容的上方和下方创建一些空间（称为边距），但您可以使用 CSS 覆盖它。

关闭段落元素

在 HTML 4 和更早的版本中，使用开始标签启动一个新段落就足够了。即使您忘记了结束标记，大多数浏览器也会正确显示 HTML。例如：

<p>This is a paragraph.
<p>This is another paragraph.

上面示例中的 HTML 代码可以在大多数 Web 浏览器中运行，但最好不要这样做，因为忘记结束标签会产生意想不到的结果或错误。

注意：出于向前兼容性和良好编码习惯的目的，建议在段落中同时使用开始标签和结束标签。

创建换行符

 标签用于在网页上插入换行符。

由于 是空元素，所以不需要对应的标签。

<p>This is a paragraph <br> with line break.</p>
<p>This is <br>another paragraph <br> with line breaks.</p>

注意：不要使用空段落 在您的网页中添加额外的空间。浏览器可能会忽略空段落，因为它是逻辑标记。改用 CSS margin属性来调整元素周围的空间或内外边距。

<hr />创建水平线条

您可以使用<hr>标签创建水平规则或线条，以直观地分隔网页上的内容部分。像 一样，<hr>标签也是一个空元素。这是一个例子：

<p>This is a paragraph.</p>
<hr>
<p>This is another paragraph.</p>

管理空白

通常，浏览器将通过按键盘上的空格键或制表键将 HTML 代码中创建的多个空格显示为单个空格。通过按回车键在 HTML 代码中创建的多个换行符也显示为一个空格。

以下段落将显示在一行中，没有任何多余的空格：

<p>This paragraph contains  multiple   spaces    in the source code.</p>
<p>
    This paragraph
    contains multiple tabs and line breaks
    in the source code.
</p>

插入 用于创建额外的连续空格，而插入 标签用于在您的网页上创建换行符，如下例所示：

<p>This paragraph has multiple&nbsp;&nbsp;&nbsp;spaces.</p>
<p>This paragraph has multiple<br><br>line<br><br><br>breaks.</p>

<pre>预定义格式化文本

有时，使用 , 等来管理空间不是很方便。这时，您可以使用<pre>标签来完全按照 HTML 文件中的内容显示空格、制表符、换行符等。这对于呈现像诗歌或代码一样重要的空格和换行符的文本是非常有帮助。

以下示例将在浏览器中显示源代码中的文本：

<pre>
    Twinkle, twinkle, little star, 
    How I wonder what you are! 
    Up above the world so high, 
    Like a diamond in the sky.
</pre>

提示：<pre>元素中的文本通常由浏览器以等宽或固定宽度字体（例如 Courier）呈现，但您可以使用 CSS font属性覆盖它。