web前端开发的软件重庆企业站seo

最近在开发react项目的一个新需求时，遇到气泡卡片Popover组件样式调整的问题，发现不管是在标签中设置className属性，还是在<Popover>标签中直接设置style属性，都不起作用。

最后搜索查阅发现要使用overlayClassName

index.js

import "./index.less"render(){const content={<div style={{ padding:10}}><span>气泡卡片中的文字内容</span></div>}return (//...<Popovercontent={text} overlayClassName="popstyle"><Icon type="question-circle"></Popover>)//...
}

index.less

.popstyle{/*在浏览器控制台调试时，需要调整哪个类名（例如：ant-popover-content）对应的样式就复制过来对应调整哪个样式*/.ant-popover-content{width:120px !important;}
}

这样调整可以避免污染全局样式，单独设置某个气泡卡片的样式。