直接修改 .dropdown-item:hover 的 color 属性即可生效，需确保 CSS 在 Bootstrap 后加载；注意同时覆盖 :focus 状态以保障可访问性，并区分浅色/深色模式。
直接改 .dropdown-item:hover 的 color 就行
bootstrap 5 默认用 css 变量控制下拉项悬停文字色，但最直白有效的做法是显式覆盖 .dropdown-item:hover 的 color 属性。只要你的 css 文件在 bootstrap 的 css 之后加载，不需要 !important 也能生效。
- 默认悬停文字色由
--bs-dropdown-link-hover-color变量决定，但直接写选择器更可控 - 别只改
.dropdown-item常态色——悬停状态是独立规则，不覆盖就不会变 - 如果用了
.dropdown-menu-dark，它会重设变量值，此时要同步覆盖深色模式下的:hover
为什么加了 color: white 还是黑色？常见三处失效点
浏览器开发者工具里看到样式被划掉，大概率是以下原因：
-
.navbar-light .dropdown-menu .dropdown-item:hover这类带父级限定的选择器权重更高，你写的.dropdown-item:hover被盖掉了 - 实际渲染的是
.dropdown-menu-dark .dropdown-item:hover，而你只改了普通模式下的规则 - 项目里用了 Sass 自定义了
$dropdown-link-hover-color，编译后生成的 CSS 已经覆盖了你的样式
推荐写法：兼顾浅色/深色模式 + 避免全局污染
用带命名空间的类名（比如 .my-navbar）限定作用域，再配合媒体查询处理深色偏好：
.my-navbar .dropdown-item:hover {
color: #fff !important;
}
@media (prefers-color-scheme: dark) {
.my-navbar .dropdown-item:hover {
color: #e0e0e0;
}
}
- 加
!important是为防 Bootstrap 内联或高权重规则干扰，不是必须，但省心 - 不建议直接改
:root下的--bs-dropdown-link-hover-color，它会影响所有下拉菜单，包括按钮下拉、表单下拉等非导航场景 - 如果项目用 Sass，优先在
_variables.scss里设$dropdown-link-hover-color: $light;，比 CSS 覆盖更干净
注意：悬停色和焦点色是两回事
用户用键盘 Tab 导航时触发的是 :focus，不是 :hover。只改 hover 不解决可访问性问题：
- 必须同时写
.dropdown-item:focus，否则键盘用户看不到聚焦反馈 - 若用
button.dropdown-item，浏览器默认 focus 样式可能和 hover 冲突，需统一处理 - 移动端没有 hover，但部分 Android/iOS 浏览器会模拟一次 hover，不能依赖它作为唯一交互提示
