如何更改<hr />元素的颜色？

Question

我尝试了各种方法来改变<hr/>的颜色：

hr{
   border-color: yellow;
   background-color:  yellow;
   color: yellow;
  }

但在Chrome和FF中看起来都是这样：

如何将其颜色更改为纯黄色？

Answer 1

给hr一个样式：

hr{
    border:0;
    margin:0;
    width:100%;
    height:2px;
    background:yellow;
}

或

border:1px solid yellow;

JsFiddle

您需要摆脱border或更改border的属性才能正常工作。

来自评论中的@Darko Z：

  

在许多浏览器中，HR的默认样式是为border添加某种阴影，因此这就是脏#whateverColourYouWant。要摆脱它，明确地设置边界（而不仅仅是border-color）是必要的。

Answer 2

要更改水平尺的颜色，请在<hr/>标记中，键入html属性color=""。然后，您可以继续为其提供所需的颜色。