使用:global在组件内去修改antd的全局样式，为何并没有生效？-灵析社区
感觉对了我想要参考[此文档](https://link.segmentfault.com/?enc=eX%2B1Wx7thAclwi5HvwfKQg%3D%3D.OJKtNENIlnQp7DFCxRPQml12gvkWkhGCPy2AJW12qwenaBb1DpM31uJ82dWjqOKZel1587dcDEUr2ETHmLnuRQ%3D%3D)使用 `:gloabal` 去修改antd的Button的样式： // CustomAntdButton/index.module.css .myButton :global(.ant-btn-primary) { background-color: red !important } // CustomAntdButton/index.tsx import './index.module.css' ... CustomButton 按钮 但是并没有任何改变：  完整代码如下： [https://codesandbox.io/s/fk7jnl](https://link.segmentfault.com/?enc=qfxvb41Xus0dYsOFCFklJw%3D%3D.O1bK79mj7IgYPznyUiBMeuXfBg%2FqqUi78IgzBOqXAhc%3D) 请问要如何才能在组件内自定义Antd组件的样式呢？
加班使我熟睡题主的"之前的提问" (https://segmentfault.com/q/1010000044200118)里我就指出来了，global
样式不是这样导入的。
你这样导入的只能是 local 样式，global 样式需要你显式指定出来：
- import './index.module.css'
+ import MyStyles from './index.module.css'
...
- 按钮
+ 按钮
第二你这个选择器依然写的不对：
- .myButton :global(.ant-btn-primary) {
+ .myButton:global(.ant-btn-primary) {
# 注意没有空格，从你的 DOM 结构上看显然它俩不是父子关系、而是同一个元素
background-color: red !important
}
***
或者还有一种改法，你就不要用 CSS Modules：
# 文件名叫 index.css，不是 index.module.css；或者你叫别的也行，只要不是 *.module.css 就可以
.myButton.ant-btn-primary { # 正常写，不需要 :global
background-color: red !important;
}
// 改成导入 index.css 而不是 index.module.css
import './index.css'
// 这里 className 跟你现在的写法一样
return () => 按钮