如何定制 antd 的样式(theme)

> antd 的组件样式(主题)是支持定制的,它的样式实现是基于 less。官方的订制手册参看 https://github.com/ant-design/ant-design/blob/master/docs/react/customize-theme.zh-CN.md

具体操作时,你还会想要了解,antd 到底暴露了哪些 less 变量以支持定制呢。

目前我的执行方法是这样的:

> 先从 antd 的代码中浏览一下要定制的组件样式,自行查看 less 变量。

比如我要修改`<Divider />`的`margin`,那么:

## Example
- 我就打开对应组件的样式源码:
https://github.com/ant-design/ant-design/blob/master/components/divider/style/index.less#L20-L26
- 发现 Line 24 行是我关注的 css 属性,但并没有以 less 变量形式实现
- So sad...


(但我已经表达完执行流程了,就是查看源码中的 less 变量~)


[恰饭]教程推荐:

不会 js 断点调试?看这里, 一碗面的成本,掌握知识和姿势~


原文地址:https://www.cnblogs.com/duxing/p/8783804.html