Question

我使用了[hr]标签，但它只显示了一条似乎是某物的边界的单行。它的左边有一个小小的边缘。以下链接应该解释我的意思。

我的代码如下：

<hr align="center">

有什么想法吗？

Answer 1

这是默认的浏览器样式。如果您不使用任何显示为水平规则（<hr />）标记的CSS。例如，这可以是您的标记：

<hr class="footer-hr" />

要设置样式，您可以使用以下CSS代码：

 .footer-hr {
 /* These are browser hacks so the horizontal line looks the same in all browsers
 (cross-browser) */
 border-color: #000000;
 background-color: #000000;
 color: #000000;
 border: 1px solid #000000;
 /* So keep them as they are - you can change the values of course */
 }

另外，为什么你要将它与中心对齐，浏览器默认情况下会这样做，据我所知。此外，如果您在CSS中添加margin: 0px;之类的内容，您可以让<hr />包裹整个页面，从最左边到最右边。

编辑：为了使线看起来不胖，你可以使用它：

在上面的CSS代码中添加以下规则：

height: 1px; /* Or change the value to whatever other number */

编辑2：当你要求一个有界的div时，我不知道你想要一个顶边或底边或两者兼而有之？无论如何这里是你需要的代码：

<强> MARKUP：

<div class="bordered-div"><!-- Some content here --></div>

<强> CSS：

.bordered-div {
border-top: 1px solid #000;
border-bottom: 1px solid #000;
}

<hr />标签显示一个小小的边缘

1 个答案: