协慌网

我想使用 CSS 更改hr标签的颜色。我在下面尝试过的代码似乎不起作用：

hr {
    color: #123455;
}

我想如果要更改<hr>标记生成的行的color ，则应使用border-color而不是color 。

虽然，在注释中已指出，如果您更改线条的大小，边框仍将与样式中指定的宽度一样，并且线条将被填充为默认颜色（大多数情况下不是期望的效果）时间）。因此，在这种情况下，您似乎还需要指定background-color （如 @Ibu 在其答案中建议的那样）。

HTML 5 Boilerplate项目的默认样式表中指定以下规则：

hr { display: block; height: 1px;
    border: 0; border-top: 1px solid #ccc;
    margin: 1em 0; padding: 0; }

SitePoint 最近发表了一篇名为“12 个鲜为人知的 CSS 事实”的文章，其中提到<hr>如果指定hr { border-color: inherit }可以将其border-color设置为其父级的color 。

• border-color可在Chrome和Safari 中使用 。
• background-color可在 Firefox 和 Opera 中使用。
• color在IE7 + 中有效 。

我认为这很有用。这是简单的 CSS 选择器。

hr { background-color: red; height: 1px; border: 0; }