bootstrap怎么修改折叠面板（Accordion）的边框颜色

Accordion默认边框颜色来自.accordion-item的border-color，继承自Sass变量$border-color或$accordion-border-color，作用于border-top和border-bottom。Accordion 默认边框颜色从哪来bootstrap 的 accordion 边框颜色默认由 .accordion-item 的 border-color 决定，而这个值继承自 $border-color sass 变量（v5.3+），最终落在 css 的 border-bottom 和 border-top 上。不是靠 .accordion-button 控制，也不是靠 box-shadow 伪装——改错地方就白调。直接覆盖 CSS 最快生效不改源码、不重编译，用自定义样式覆盖即可。关键点是提高选择器权重，且必须作用于 .accordion-item：加 !important 不推荐，但临时调试可用：.accordion-item { border-color: #0d6efd !important; }更稳妥写法是增强选择器：.my-accordion .accordion-item { border-color: #dc3545; }，然后给外层容器加 class="my-accordion"注意：只设 border-color 不够，border-width 和 border-style 也要一致，否则可能断线或变虚——Bootstrap 默认是 1px solid用 Sass 变量全局修改（适合项目级定制）如果你用的是 Bootstrap 源码（如通过 npm + Sass 引入），改变量最干净：在自定义 Sass 文件里，先定义 $border-color: #28a745;，再 @import "bootstrap/scss/bootstrap";别漏掉 $accordion-border-color —— v5.3+ 新增了这个独立变量，优先级高于 $border-color，直接设它更精准：$accordion-border-color: #6f42c1;改完必须重新编译 CSS，热更新（HMR）通常不自动触发变量变更，手动重启构建进程为什么加了样式没反应？常见踩坑点边框“消失”或“不变色”，大概率是这些原因： Murf AI AI文本转语音生成工具