引导面板标题和主体之间恼人的白线

Question

使用引导程序 3 和可折叠面板。如何在显示正文时删除标题和正文之间的白线。

.HTML

<div class="panel-group">
<div class="panel panel-default">
    <div class="panel-heading">
      <h4 class="panel-title">
          <a data-toggle="collapse" href="#collapseTools" >Tools</a>                                    
        </h4>
    </div>
    <div id="collapseTools" class="panel-collapse collapse in">
      <div class="panel-body">
        hello
      </div>
    </div>
  </div>
</div>

.CSS

.panel {
  background: #222222;
  border: 0;
}
.panel-default >.panel-heading {
  background: #222222;
  color: #eeeeee;
}
.panel-default >.panel-collapse {
  background: rgb(0, 145, 210);
  color: #ffffff;
  border-radius: 12px;
}

斯菲德尔

Answer 1

您的panel-body类有一个border-top: 1px #ddd集。

如果您

仍然想要 1px 的空间，您可以将颜色设置为 transparent

或者您可以设置border: 0来摆脱它。