我使用Bootstrap 5.1，使用
下面是手風琴的css：
.accordion-button: :after {
background-image: url("data:image/svg xml,"/span>）。)
}
.accordion-button:not(.collapsed): :after {
background-image: url("data:image/svg xml,"/span>）。)
}
如果能得到任何幫助，使雪佛蘭轉過來，我們將不勝感激。
uj5u.com熱心網友回復：
首先確保你對.accordion-button和.accordion-collapse都使用唯一的id。
如果它是默認折疊的，在
.accordion-button上添加.collapsed，并將aria-expended設定為true。
。
.accordion-button::after {
background-image: url("data:image/svg xml,"/span>）。)
}
.accordion-button:not(.collapsed): ：after {
background-image: url("data:image/svg xml,"/span>）。)
}<link href="https://cdnjs. cloudflare.com/ajax/libs/bootstrap/5.0.2/css/bootstrap.min.css" rel=" stylesheet"/>
<script src="https://cdn.jsdelivr. net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="ha384- eMNCOe7tC1doHpGoWe/6oMVemdAVTMs2xqW4mwXrXsW0L84Iytr2wi5v2QjrP/xp" crossorigin="anonymous"/span>> </script>>
< script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-cn7l7gDp0eyniUwwAZgrzD06kc/tftFf19TOAs2zVinnD/C7E91j9yyk5///jjpt/" crossorigin="anonymous"/span>> </script>>
< div class="accordion" id="accordion">/span>
<div class="accordion-item"/span>>
< h4 class="accordion-header" id=" headingOne">
< button class="accordion-button collapsed" 型別="按鈕" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria- expanded="true" aria-controls="collapseOne">
當前課程
</button>
</h4>/span>
< div id="collapseOne" class="accordion collapse折疊" aria-labelledby=" headingOne" data-bs-parent="#accordion">
<div class="accordion-body"/span>>
{current_courses}
<p class="course">< a class="course-link" href="{current_courses: link_to_course}">{current_courses:title}</a>{current_courses:hours} CPE小時數 {current_courses:course_date}</p> {current_courses:course_date}</p>
{/current_courses}
</div> {/span>
<! /. accordion-body -->
</div>/span>
<! -- /.collapse -->
</div>/span>
<!--/.accordion-item -->轉載請註明出處，本文鏈接：https://www.uj5u.com/net/309225.html
標籤：