css - 改变antdesign标题的颜色

Question

我正在尝试更改 antdesign 中整个标题的背景颜色。我不确定，但默认文件应该是这个 https://github.com/ant-design/ant-design/blob/master/components/style/themes/default.less

我发现这里使用了标题的颜色，所以我将其更改为红色

全局.less

@import "./vars.less";

@layout-header-background: red;

但它被另一个类覆盖

现在我的问题是实现标题颜色更改的最佳实践是什么。

Answer 1

<Header />的背景颜色可以简单地使用 JSS 进行更改或在其上放置一个类:

<Header style={{backgroundColor: "red"}}>...</Header>

或

<Header className="red-header">...</Header>

和CSS

.red-header{
    background-color: red;
}

也许你看到的是 <Menu/> 的颜色成分。您还可以使用 JSS 修改它的颜色或在其上放置一个类:

<Menu style={{backgroundColor: "red"}} mode="horizontal">...</Menu>

请参阅此处的示例