在尝试更改弹出框箭头的颜色时，我尝试了一些在网上找到的解决方案。这是我的 CSS，它位于一个自行创建的 popover.css 文件中(这里的其他 CSS 工作正常)。
popover.bottom .arrow::after {
border-bottom-color: black !important;
}
这是在 DOM 中应用的样式
最佳答案
对于 Bootstrap 5，使用这个:
.popover .popover-arrow::before, .popover .popover-arrow::after {
border-color: #FFA500 !important; /* this example changes the arrow to orange color... You can always replace with any color you choose. */
border-top-color: transparent !important;
border-bottom-color: transparent !important;
}
请注意，在写作结束时，bootstrap 5 处于 alpha 阶段。这可能适用于也可能不适用于 bootstrap 5 的稳定版本。然而，我怀疑从这一点开始，关于源代码的任何内容都会发生变化。 • 所以这应该是稳定版本的标准 Bootstrap 5。
您可以将上述代码保存在单独的 css 文件中(例如 custom.css )并将其链接到您的 HTML 中<head></head> 内的文件部分...希望这可以帮助那里的人。
关于css - 如何更改 Bootstrap 弹出框箭头的颜色？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/54337652/