从 Bootstrap 手风琴中删除边框答案

【问题标题】：Remove border from Bootstrap accordion从 Bootstrap 手风琴中删除边框
【发布时间】：2021-12-09 22:11:18
【问题描述】：

我一直被困在我无法解决的这个（显然很容易）的事情上。我正在使用 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 是这样的：

【问题讨论】：

我正在使用手机，但我在 Napoli 后面看到一个错误的关闭标签
我不认为阴影是手风琴的 Bootstrap 样板，这意味着我认为您可能是从其他地方拾取它的。检查元素时，哪个元素有阴影？
css 缺少面板标题。添加它并将边框设置为 0
@RodrigoSantiaborg 我已经尝试将 .panel-title 边框设置为 0，但它不起作用......
这不是一个解决方案，但这里有一个可以提供帮助的小提琴。 jsfiddle.net/plushyObject/tpd0gzk8

标签： html css twitter-bootstrap border accordion

【解决方案1】：

不要使用 !IMPORTANT。

这行得通：

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

【讨论】：

也可以加"box-shadow: none;"删除看起来像底部边框的东西

【解决方案2】：

试试这个。我可以删除单击手风琴标题时出现的默认蓝色边框。

:focus {
  outline: 0 !important;
  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0) !important;
}

【讨论】：

【解决方案3】：

.panel-body {border-top: 0 !important;}

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

【讨论】：

不要用 !important 覆盖。那很不好。伙计，我的解决方案更好。
使用 !important 会让您看起来不知道自己在做什么。
@plushyObject 为什么它可以在语言中使用？
如果您有效地使用 CSS 选择器，通常不需要使用 !important。我经常看到人们在样式级联方面存在特定性问题时使用 !important，这意味着他们创建的类在 DOM 元素上不如 CSS 中的另一个特定，这就是为什么你有一个疯狂的选择器，比如被选中的答案。它存在于语言中，作为对编写不佳的 CSS 的快速修复。对不起，如果这伤害了你的感情。
!important 很好用。忽略那个咆哮