覆盖 antd 组件样式/类名 [英] override antd component style/className
问题描述
我正在尝试更新 antd 组件样式.我正在使用这个:https://pro.ant.design/docs/style#override-the-component-style 作为尝试更新组件样式的参考,但我无法使其正常工作.
I'm trying to update a antd component style. I'm using this: https://pro.ant.design/docs/style#override-the-component-style as reference to try updating a component styling but I can't make it to work.
这是我正在尝试的东西:https://codesandbox.io/s/cool-wind-kkub0?file=/index.less我不明白我错过了什么.有什么建议吗?
Here's something I'm trying: https://codesandbox.io/s/cool-wind-kkub0?file=/index.less I don't understand what I am missing. Any suggestions?
推荐答案
您正在使用范围样式,这是通过弹出您的应用程序或安装 npm 包来加载样式组件样式来实现的.为此,请将 .less 代码粘贴到 index.css 文件中
You are using scoped styling which is achieved by ejecting your app or installing npm package for loading styled component styles. For this to work, paste your .less code in your index.css file
index.css
.ant-select-selection {
max-height: 51px;
overflow: auto;
background-color: blue;
}
.ant-select-selection-search-input {
background-color: green;
}
.ant-select-item-option-content {
background-color: orange;
}
.ant-select-item {
position: relative;
display: block;
min-height: 32px;
padding: 5px 12px;
color: red;
font-weight: normal;
font-size: 14px;
line-height: 22px;
cursor: pointer;
-webkit-transition: background 0.3s ease;
transition: background 0.3s ease;
background-color: #9068b0;
}
这篇关于覆盖 antd 组件样式/类名的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!