在每个div下面用css行

Question

我试图在容器中的每个div下面显示一行。我们不是每次都使用<hr>标签，而是选择使用css处理此问题吗？

Html代码

#LinksContainer hr {
  border: none;
  height: 1px;
  color: #ccc;
  background-color: #ccc;
  text-align: left;
  width: 85%;
}

<div id="LinksContainer">
  <div><a href="#" target="_blank">Forum1</a></div>
  <hr/>
  <div><a href="#" target="_blank">Forum2</a></div>
  <hr/>
  <div><a href="#" target="_blank">Forum3</a></div>
  <hr/>
  <div><a href="#" target="_blank">Forum4</a></div>
  <hr/>
</div>

Answer 1

您可以添加css属性border-bottom: 1px solid grey;，例如

这是一种语法：

border-bottom: [border-width || border-style || border-color] | inherit