Question

好的，所以这里是代码

＆＃13;

.div1 {
  background-color:skyblue;
  font-family:Verdana;
  text-align:right;
  height:100px;
  width:200px;
  display:block;
  overflow:hidden;
}
.div2 {
  background-color:lightgreen;
  font-family:Verdana;
  text-align:left;
  height:100px;
  width:200px;
  display:block;
  overflow:hidden;
}

＆＃13;

<div class="div1">
  <h1>Hey</h1>
</div>
<hr>
<div class="div2">
  <h1>Hello</h1>
</div>

＆＃13;

jsfiddle

正如你所看到的，我试图在两个div之间放一个小时。这很好，除了我想要的黑线周围的白色空间。我知道它应该是这样的，但有没有办法让黑线变得干净？

Answer 1

简单使用margin: 0到hr元素：

hr{
    margin: 0;
}

＆＃13;

.div1 {
    background-color:skyblue;
    font-family:Verdana;
    text-align:right;
    height:100px;
    width:200px;
    display:block;
    overflow:hidden;
}
.div2 {
    background-color:lightgreen;
    font-family:Verdana;
    text-align:left;
    height:100px;
    width:200px;
    display:block;
    overflow:hidden;
}
hr {
    margin: 0;
}

＆＃13;

<div class="div1">
     <h1>Hey</h1>

</div>
<hr>
<div class="div2">
     <h1>Hello</h1>

</div>

＆＃13;

如何防止<hr />在两个div之间创建空格？

1 个答案: