在本文中，我们将向您展示如何使用 HTML 在网页中添加水平线。水平线，也称为水平线，是一种分隔网页上内容的方式，可用于视觉吸引力或指示内容的变化。
在HTML中，有多种方法可以在网页中添加水平线，但最常见的方法是使用<hr>标签。<hr>标签是一个自闭合标签，用于在网页上创建一条水平线。这种方法简单直接，代码量很少。然而，它在自定义方面的灵活性不太高。使用<hr>标签创建的水平线将具有默认的外观和感觉，可能与您网页的设计不太协调。
在 HTML 中添加水平线的另一种方法是使用 CSS。通过使用 CSS，您可以自定义水平线的外观以匹配网页的设计。您可以更改水平线的颜色、宽度、高度和其他属性，使其无缝地融入您的网页。
我们将在本文后面的部分中通过示例和代码片段详细讨论这两种方法。
在HTML中有两种主要的方法来添加水平线 -
使用
使用CSS
在HTML中添加水平线的第一种方法是使用<hr>标签。这种方法快速且易于实现，非常适合需要在网页上分隔内容的简单水平线的情况。此外，<hr>标签受到所有主要的网络浏览器的支持，因此您可以确保它在您的网页上正确显示。然而，<hr>标签的默认外观可能并不总是与您的网页设计相匹配。
如果您需要更多控制水平线的外观，您可以使用CSS来自定义<hr>标签，或者使用第二种方法使用CSS。使用CSS，您可以更改水平线的颜色、宽度、高度和许多其他属性，使其与您的网页设计更协调。
以下是如何使用
第 1 步 - 创建一个 html 文件 (index.html)。
第二步 - 在您希望水平线出现的位置添加<hr>标签。
<body> <h1>Welcome to Tutorials Point</h1> <hr> <p>This is some text that will appear below the horizontal line.</p> </body>
第 3 步 - 保存文件并通过在网络浏览器中打开它来查看它。
<!DOCTYPE html> <html> <body> <h1>Welcome to Tutorials Point</h1> <hr> <p>This is some text that will appear below the horizontal line.</p> </body> </html>
在 HTML 中添加水平线的第二种方法是使用 CSS。使用 CSS 创建水平线可以让您更好地控制线条的外观。您可以更改颜色和粗细，甚至可以向线条添加背景颜色或图像。此外，您还可以使用 CSS 动画和过渡来创建有趣的效果。
通过使用 CSS，您可以创建一条引人注目的线条，并为您的网页添加独特的风格。使用 CSS，您还可以创建具有不同样式的多行，并将它们应用到网页的不同部分，这对于在页面上的不同元素之间创建视觉分隔非常有用。
以下是使用CSS添加水平线的示例：
第 1 步 - 创建一个 html 文件 (index.html)。
步骤 2 - 在您希望水平线出现的位置添加 标记。
<body> <h1>Welcome to Tutorials Point</h1> <div class="horizontal-line"></div> <p>This is some text that will appear below the horizontal line.</p> </body>
第三步 - 在你的CSS文件（style.css）中使用border-bottom属性来创建一条水平线。
border-bottom: 2px solid black;
步骤 4 - 将该类应用于<div>标签。
.horizontal-line {
border-bottom: 2px solid black;
}
第5步 - 保存文件，并通过在Web浏览器中打开来查看。
<!DOCTYPE html>
<html>
<head>
<style>
.horizontal-line {
border-bottom: 2px solid black;
}
</style>
</head>
<body>
<h1>Welcome to Tutorials Point</h1>
<div class="horizontal-line"></div>
<p>This is some text that will appear below the horizontal line.</p>
</body>
</html>
在本文中，我们向您展示了两种使用 HTML 向网页添加水平线的方法。第一种方法是使用
