Question

我有一个多塌手风琴，我正试图在其中一个小组中安装另一个多坍塌手风琴。

当我切换面板并出现嵌套手风琴时，所有面板都已处于活动状态。

我希望嵌套的手风琴不处于活动状态（蓝色带' - '），但所有面板都是灰色，并带有'+'图标。

感谢您的建议。

<div class="panel-group multi-collapse" id="accordion1">

      <div class="panel panel-default">
          <div class="panel-heading">
            <div class="panel-title">
              <a data-toggle="collapse" data-parent="#accordion1" href="#collapse1">NEWS 1</a>
            </div>
          </div>
          <div id="collapse1" class="panel-collapse collapse in">
            <div class="panel-body">

                <!-- Here is nested accordion -->

            <div class="panel-group multi-collapse" id="accordion2">

              <div class="panel panel-default">
                <div class="panel-heading">
                  <div class="panel-title"><a data-toggle="collapse" data-parent="#accordion2" href="#collapseNested1">
                    News 1 Heading
                  </a></div>
                </div>
                <div id="collapseNested1" class="panel-collapse collapse">
                  <div class="panel-body">
                    News 1a Text ...
                  </div>
                </div>
              </div>

              <div class="panel panel-default">
                <div class="panel-heading">
                  <div class="panel-title"><a data-toggle="collapse" data-parent="#accordion2" href="#collapseNested2">
                    News 2 Heading
                  </a></div>
                </div>
                <div id="collapseNested2" class="panel-collapse collapse">
                  <div class="panel-body">
                    News 2a Text ...
                  </div>
                </div>
              </div>

              </div>

            <!-- Inner accordion ends here -->

            </div>
          </div>
        </div>

        <div class="panel panel-default">
          <div class="panel-heading">
            <div class="panel-title"><a data-toggle="collapse" data-parent="#accordion1" href="#collapse2">NEWS 2</a></div>
          </div>
          <div id="collapse2" class="panel-collapse collapse">
            <div class="panel-body">
                News 2 Text ...
            </div>
          </div>
          </div>

      </div>

Answer 1

马克..在style.css第2101行中的活动类之后添加>，就像这样

 /* line 1658, ../sass/_typography.scss */
.panel-group .panel.active > .panel-heading > .panel-title > a:after,
.panel-group .panel.active > .panel-heading > .panel-title > a:hover:after {
  display: none;
}

Bootstrap嵌套多折叠手风琴，删除活动状态

1 个答案: