在create react app中覆盖ant-design的样式

Question

我在我的CRA应用程序中使用ant-design，当我试图覆盖ant组件的样式时，我在响应中给了元素一个className，但是ant中的样式总是覆盖我的样式，只是给了一个ID。

CRA应用程序不会弹出，而是使用Less重新连接。

这是我想要使用但不起作用的方式：

在反应组件中：

<Card className="my-classname"><Card>

在index.css中：

.my-classname { ... }

谷歌搜索后，我发现className不会覆盖蚂蚁设计，但将ant与我的css风格结合起来。因此，在我试图覆盖ant设计也指定的值的情况下，除非我使用ID规范，否则我的css不会生效。

我现在的问题是我应该只使用ID所以我的所有css都会覆盖吗？

Answer 1

我在浏览器中渲染的最终html代码周围的abit之后找到的解决方案是覆盖antd类的样式。例如： - 我想在项目中使用我的自定义卡片样式。所以，我为它覆盖了蚂蚁卡头。我们可以使用它覆盖任何其他类。您只需在浏览器中检查呈现的反应并找到与之关联的正确类。

.ant-card-head{
    border: 0;
    text-align: left;
}