一般来说，你不能像设置其他颜色一样，用CSS设置水平线的颜色。 首先，Internet Explorer需要CSS中的颜色读起来像这样:

“颜色:# 123455”

但是Opera和Mozilla需要你的CSS中的颜色读起来像这样:

background - color: # 123455”

因此，您需要将这两个选项添加到您的CSS中。

接下来，你需要给水平线一些尺寸，否则它将默认为浏览器设置的标准高度、宽度和颜色。 下面是一个示例代码，说明了你的CSS应该是什么样的，才能得到蓝色的水平线。

hr {
border: 0;
width: 100%;
color: #123455;
background-color: #123455;
height: 5px;
}

或者当你插入一条水平线时，你可以直接在你的HTML页面中添加样式，就像这样:

<hr style="background:#123455" />

希望这能有所帮助。

我认为你应该使用border-color而不是color，如果你的意图是改变<hr>标签产生的线条的颜色。

尽管如此，评论中已经指出，如果你改变了线条的大小，边框仍然会和你在样式中指定的一样宽，并且线条将被默认的颜色填充(这在大多数情况下不是理想的效果)。所以在这种情况下，你似乎还需要指定background-color(就像@Ibu在他的回答中建议的那样)。

HTML 5样板项目在其默认样式表中指定了以下规则:

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

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

我喜欢设置边界顶部的答案，但他们不知何故仍然有点离开Chrome… 但是如果我设置border-top: 1px纯黑色;And border-bottom: 0px;我最终得到了一条真正的单线(这也适用于更高的厚度)。

好吧，我是新的HTML, CSS和Java，但我尝试了我的方式，这对我在所有浏览器。我使用JS而不是CSS，它不适用于一些浏览器。

首先，我给HR元素赋予id="myHR"，并在Java Script中使用。 以下是守则。

x = document.getElementById("myHR");
y = x.style.width = "600px";
y = x.style.color = "white";
y = x.style.height = "2px";
y = x.style.border = "none";
y = x.style.backgroundColor = "lightgrey";

你可以给<hr noshade>标签，然后到你的css文件中添加:

人力资源{ border-top: 0; 颜色:# 123455; ｝ <hr noshade /> 这是个测试 <hr noshade />

hr {
  background-color: #123455;
}

背景是你应该尝试改变的。

你也可以使用边界的颜色。我不确定;我认为这存在跨浏览器的问题。您应该在不同的浏览器中测试它。