html - 如何改变<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在评论中:

In many browsers the default style for HR is to add some sort of shading to the border so this comes out as dirty #whateverColourYouWant. To get rid of it, setting border explicitly (and not just border-color) is necessary.