Ant Design Select 下拉菜单项 Hover 样式设置

Ant Design Select 下拉菜单项 Hover 样式设置

在使用 Ant Design 的 Select 组件时，我们可能需要对下拉菜单项的 Hover 样式进行自定义。下面介绍两种方法来实现这个功能：

1. 使用 CSS

.ant-select-dropdown-menu-item:hover {
  background-color: #f5f5f5;
}

2. 使用 Less 变量

@select-dropdown-menu-item-hover-bg: #f5f5f5;

.ant-select-dropdown-menu-item:hover {
  background-color: @select-dropdown-menu-item-hover-bg;
}

使用 Less 变量的好处是：

• 提高代码的可读性和可维护性
• 方便统一管理样式
• 可以根据需要修改变量的值

注意：

• 以上代码需要在 Ant Design 的样式文件中添加
• 您可以根据自己的需求修改背景颜色和其他样式属性