大家好!今天是鐵人賽的第26天，很高興即將完賽啦!各位有努力堅持下去嗎?!
今天要講的是摺疊的效果，摺疊插件用於顯示和隱藏內容。

collapse

collapse

<p>
    <a class="btn btn-primary" data-bs-toggle="collapse" href="#collapse" role="button" aria-expanded="false" aria-controls="collapse">
        test collapse with href
    </a>
    <button class="btn btn-primary" type="button" data-bs-toggle="collapse" data-bs-target="#collapse" aria-expanded="false" aria-controls="collapse">
        test collapse with button
    </button>
</p>
<div class="collapse" id="collapse">
    <div class="card card-body">
        test collapse
    </div>
</div>

水平展開的collapse

水平展開的collapse

<p>
    <button class="btn btn-primary" type="button" data-bs-toggle="collapse" data-bs-target="#collapseWidth" aria-expanded="false" aria-controls="collapseWidth">
        collapse 水平展開效果
    </button>
</p>
<div>
    <div class="collapse collapse-horizontal" id="collapseWidth">
        <div class="card card-body" style="width: 300px;">
            collapse 水平展開效果
        </div>
    </div>
</div>

以上為今天的鐵人賽文章，各位明天見囉!莎喲娜拉!