如何更改Ant-Design“选择”组件的样式？

小编典典

reactjs

假设我想将“选择”组件的标准白色背景颜色更改为绿色。

我的尝试…

<Select
 style={{ backgroundColor: 'green' }}>
   // Options...
</Select>

…没有做到。

有人可以指出我正确的方向吗？

[编辑]

我最终使用了Jesper We建议的方法。

覆盖所有选择的颜色…

.ant-select-selection {
  background-color: transparent;
}

…然后我可以分别为Select组件设置样式。

阅读 591

2020-07-22

共1个答案

小编典典

<Select>呈现<div>s的整个集合，您需要查看生成的HTML元素树以了解您的操作。您无法通过style属性完成此操作，而需要在CSS中完成。

附加背景色的合适位置是

.ant-select-selection {
  background-color: green;
}

这将使所有选择变为绿色。className如果您想为不同的选择使用不同的颜色，请给他们单独的。

2020-07-22