Css 蚂蚁设计按钮颜色更新

我正在尝试更新我的REACT应用程序中此链接中提到的ant design收音机的单选按钮颜色

并尝试使用这篇文章中的建议来更新颜色

https://stackoverflow.com/questions/62609951/how-to-change-radio-button-color-in-ant-design

但是我的颜色没有更新。我不确定我在这里没有做错什么。 另外，它是一个REACT项目，my package.json对“antd”有依赖关系“^4.5.0” antd.css的导入存在于app.tsx中，如下所示

// Global styles
import "antd/dist/antd.css";

这是我在项目的一个组件文件中拥有的代码

文件名：MyRadio.tsx

import { Radio } from "antd";
import styles from "./mystyles.module.scss";



  return (
        <Radio.Group
          className={styles.toggle}
        >
          <Radio id="RDC" value="C">
            C
          </Radio>
          <Radio id="RDI" value="I">
            I
          </Radio>
        </Radio.Group>
      );

---更新1

---

您需要覆盖以下类。它应该会起作用。使用！仅当css被现有类覆盖时才重要。 您需要导入“antd/dist/antd.css”；在控制台中获取这些，然后覆盖css

---

编辑-包括codesandbox链接和悬停css，您需要覆盖以下类。它应该会起作用。使用！仅当css被现有类覆盖时才重要。 您需要导入“antd/dist/antd.css”；在控制台中获取这些，然后覆盖css

---

编辑-包括代码沙盒链接和悬停css

我不能写评论（声誉太低），所以我会写一个“答案”。您可以尝试更改ant设计的主题（此默认蓝色为主要颜色）。但是它需要一些改变，新的颜色将在全球范围内应用，因此对于现有的大型项目来说，它不是太好。

我不能写评论（声誉太低），所以我会写一个“答案”。您可以尝试更改ant设计的主题（此默认蓝色为主要颜色）。但是，它需要一些更改，并且新的颜色将在全球范围内应用，因此它对于现有的大型项目来说并不太好。

请在此处更新您的代码并将fork发送给我：谢谢m4n0，现在就这样做。.我只是看到一个错误，而不是您的输出：对不起，m4n0，不知道为什么它没有保存。请您现在重试。请更新您的代码并将fork发送给我：谢谢m4n0，现在就这么做..我只是看到一个错误，而不是您的输出：对不起m4n0，不知道为什么它没有保存。请你现在试试，看看这个！谢谢@anand，我看到你带来了import“antd/dist/antd.css”；如果我重写现有的类，是否也需要将其放入我的文件中？因为我现在没有。好的，我看到沙盒代码正在更新，但是我需要代码方面的帮助。正如您所看到的，我的广播组正在使用mystyles.module.scss中的切换类，如果我将您的代码添加到.scss，我仍然看不到颜色更新。请检查此。。我正在更新我的帖子，看看它看起来怎么样；在代码中，您可以覆盖CSS。如果没有这一点，CSS就不会出现在控制台中，甚至无法覆盖。请检查此项！谢谢@anand，我看到你带来了import“antd/dist/antd.css”；如果我重写现有的类，是否也需要将其放入我的文件中？因为我现在没有。好的，我看到沙盒代码正在更新，但是我需要代码方面的帮助。正如您所看到的，我的广播组正在使用mystyles.module.scss中的切换类，如果我将您的代码添加到.scss，我仍然看不到颜色更新。请检查此。。我正在更新我的帖子，看看它看起来怎么样；在代码中，您可以覆盖CSS。如果没有这一点，CSS就不会出现在控制台中，甚至无法覆盖。

.toggle {
  width: 244px;
  background: #ffffff;
  border: 1px solid #d9d9d9;
  box-sizing: border-box;

  display: flex;
  align-items: center;
  float: left;
 
}
/*  Followed suggestion from other post but didnt see colors updating, when I un-comment the following code
.ant-radio-checked .ant-radio-inner {
  border-color: red !important ;
}

.ant-radio-checked .ant-radio-inner:after {
  background-color: red;
}

.ant-radio:hover .ant-radio-inner {
  border-color: red;
}
*/

.ant-radio-inner:after {
  background: red !important;
}

.ant-radio-checked .ant-radio-inner,
.ant-radio:hover .ant-radio-inner,
.ant-radio-wrapper:hover,
.ant-radio-input:focus .ant-radio-inner {
  border-color: red !important;
}