大家早上好,
我有一个Bootstrap问题。我有以下HTML页面
<!DOCTYPE html>
<html lang="nl-NL">
<body>
<div class="container-md">
<br>
<div class="accordion" id="accordionAikido">
<div class="accordion-item">
<h2 class="accordion-header" id="headingOne">
<button class="accordion-button" type="button" data-bs-toggle="collapse"
data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Lorem Ipsum Header
</button>
</h2>
<div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne"
data-bs-parent="#accordionAikido">
<div class="accordion-body">
<p>Lorem Ipsum</p>
</div>
</div>
</div>
</div>
</div>
<footer class="container-md">
<p id="copyright">© Freddy Meijer</p>
</footer>
</body>
</html>
我在CSS文件中稍微改变了 accordion 的颜色:
h4,
p,
#copyright {
color: #fbfcfd;
padding-left: 10px;
}
.accordion-body{
background-color: #7aa8bd;
}
.accordion-button{
background-color: #fbfbef;
}
但现在我遇到了一个问题,你可以看到折叠时的颜色是黄的,但当我打开 accordion 时,颜色是蓝色的:
我试了好几种方法,但我都不能把蓝色变成另一种黄色。我错过了什么?
我试着改变CSS中每个ID和类的颜色,但没有任何帮助。
.accordion-button.collapsed::after
建议使用this post,但不起作用。按钮仍为蓝色。
2条答案
按热度按时间nfs0ujit1#
如果你添加了下面的CSS,那么当你打开 accordion 的时候,它会保持黄色。
2wnc66cl2#
请使用带有折叠按钮的类“bg-warning text-dark bg-opacity-10”。
请参阅this链接以了解。