css Bootstrap 3折叠-仅折叠一个面板

2lpgd968  于 2022-11-27  发布在  Bootstrap
关注(0)|答案(1)|浏览(149)

我需要有一个允许一次只折叠一个面板的折叠面板。但是我的折叠面板允许一次打开多个面板。
我不知道我做错了什么。下面是我的代码:

<div class="col-lg-8 col-md-12 col-sm-12 col-xs-12">
<div class="panel-group" id="h-promocje" role="tablist" aria-multiselectable="true" style="">
<?php foreach ($promocje as $key => $promocja) { ?>
    <div class="panel-default">
        <a class="accordion-toggle collapsed" role="button" style="text-decoration:none !important;" data-toggle="collapse" data-parent="#h-promocje" href="#promocja<?=$key?>" aria-expanded="true" aria-controls="promocja<?=$key?>">
            <div class="panel-heading" role="tab" id="h-promocja<?=$key?>" style="border-bottom: 1px solid white;padding-left: 0;padding-right: 0;">
                <h4 class="panel-title" style="color:white;font-size:18px;font-weight:bold;text-transform: uppercase;padding-top: 4px; padding-bottom: 3px;text-align: left;">
                    <?=$promocja->tytul?>
                </h4>
            </div>
        </a>
        <div id="promocja<?=$key?>" class="panel-collapse collapse" role="tabpanel" aria-labelledby="promocja<?=$key?>">
            <div class="panel-body">
                <?=$promocja->opis?>
            </div>
        </div>
    </div>
<?php } ?>
</div>
mbskvtky

mbskvtky1#

您正在使用Bootstrap。Bootstrap的折叠需要在可折叠结构中声明.panel类,并在结构中+使用data-parent=""属性,否则它不能作为折叠面板工作。您尚未添加面板类,请使用panel-default类添加它。
第一个
下面是来自Bootstrap站点的示例。尝试删除面板类。

相关问题