如何更改<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)设置边框是必要的.