html - 换行符 未按预期呈现

Question

知道为什么我的绿色上方有一条灰色细线

---

以及如何去除它？

谢谢

https://jsfiddle.net/Lc7gym88/

hr {
  border-bottom: 4px solid #469551;
  width: 30%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0px !important;
  height: 0;
}

Answer 1

是因为<hr/>有边框(至少在 FireFox 中自 <hr/> 具有浏览器相关样式)。

先去除边框。

hr {
  border: none;
  border-bottom: 4px solid #469551;
  width: 30%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0px !important;
  height: 0;
}
body {
  background-color: black;
}

<br/>
<hr/>