覆盖 antd 自动完成下拉悬停颜色答案

【问题标题】：override antd autocomplete dropdown hover color覆盖 antd 自动完成下拉悬停颜色
【发布时间】：2020-11-21 06:05:09
【问题描述】：

对于 antd 自动补全组件，当鼠标悬停下拉时，选项会变成浅灰色。有没有办法覆盖颜色？

【问题讨论】：

您是否尝试过使用!important 覆盖颜色？
我找不到要覆盖的正确类
@jason135 Antd 使用较少的颜色变量，在您的情况下，您可以更改此变量@item-hover-bg: #f5f5f5; 请参阅文档中提到的步骤ant.design/docs/react/customize-theme

标签： css antd

【解决方案1】：

我不是 antd 用户，但在 Ant Design 组件示例中的 AutoComplete 快速查找公开了一些您可以覆盖的 CSS：.ant-select-item-option-active:not(.ant-select-item-option-disabled)

根据您的特定设置，您应该能够在自定义 CSS 中简单地添加该类和伪 (:not) 以覆盖颜色或任何其他未包含并符合规范的样式，如果这样不起作用，您始终可以将 !important 附加到值的末尾（如@PaulBaiju 的问题 cmets 中首先提到的那样）。

【讨论】：

使用.ant-select-item-option:hover:not(.ant-select-item-option-disabled) 覆盖悬停
哎呀，是的应该已经发现它是悬停未选择。将为遇到此问题的任何人更新
编辑后，似乎 antd 没有为此使用悬停伪代码，因为它在鼠标悬停事件上应用了“活动”命名空间的类。您评论的实现确实增加了一个额外的特异性来取代它，但我认为无论哪种方式我都会对它发表评论。一段时间以来，我一直想尝试 Ant Design，但一直被困在 Material (UI) 世界中，所以这是一个不错的介绍，虽然很轻松。谢谢！