Question

我一直坚持这个（显然很容易）我无法解决的问题。我正在使用Bootstrap 3.2.0并且我无法移除手风琴面板标题和面板主体之间的线，而其他每个边框和阴影都消失了。我已经尝试了在发布之前可能给出的所有建议，但没有运气。这是HTML代码：

<ul class="nav nav-pills nav-stacked">
  <div class="panel-group" id="accordion">
    <div class="panel panel-default">
      <div class="panel-heading">
        <p class="panel-title">
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse1">PROJECTS</a>
        </p>
      </div>
      <div id="collapse1" class="panel-collapse collapse">
        <div class="panel-body">
          <ul>
            <li><a href="#napoli" tabindex="-1" data-toggle="tab">NAPOLI</a></li>
            <li><a href="#portraits" tabindex="-1" data-toggle="tab">PORTRAITS</a></li>
          </ul>
        </div>
      </div>
    </div>
    </div>
   </ul>
</div>

到目前为止，这是相关的CSS ......

.panel-group{
    margin:0;
}

.panel{
    border:none;
    box-shadow:none;
}

.panel-heading{
    padding:0;
}

This的样子如下：

Answer 1

不要使用！重要。

这有效：

.panel, .panel-group .panel-heading+.panel-collapse>.panel-body{
    border: none;
}

Answer 2

.panel-body {border-top：0！important;}

这会解决这个问题，但也许最好添加一个自定义类或内联样式，只删除需要的边框。

从Bootstrap手风琴中移除边框

2 个答案: