我有一个自定义的 ReactJS 组件,我想以某种方式设置样式,并将其作为插件提供给许多不同的网站。但是,当网站使用全局样式(Twitter bootstrap 或其他 css 框架)时,它会添加并覆盖我的组件的样式。例如:
全局.css:
label {
color: red;
font-weight: bold;
}
Run Code Online (Sandbox Code Playgroud)
组件.js:
class HelloMessage extends React.Component {
render() {
let style = {
color: "green"
};
return (<label style={style}>Hello</label>);
}
}
Run Code Online (Sandbox Code Playgroud)
结果:
上面我没有在组件的样式中使用“font-weight:bold”,但结果我的组件正在使用它。
我希望能够封装我的自定义组件的样式,使它们在所有网站上看起来都相同。