相关疑难解决方法(0)

如何将Bootstrap限制为div的范围？我需要将ExtstS应用程序中的Bootstrap样式表嵌套到特定的div中,并且两者都发生冲突,因为它们需要自己的主体,ul,li,a等.

我试图避免手动编辑bootstrap.css(或将其保持在最低限度),以便可以轻松更新.

我有几个组件具有以下CSS /组件结构

About/style.css

.AboutContainer {
    # Some style
}

p > code {
    # Some style
}

我按如下方式在组件中导入CSS

About/index.js

import './style.css';

export default class About extends Component {
    render() {
         # Return some component
    }
}

但是,CSS将在该<header>部分中导入并保持全局范围.

我期待CSS是:

1. 组件范围的方式是样式仅应用于仅在此组件中呈现的事物.
2. 如果卸载组件,则此组件的样式将消失.

但是,在从浏览器进行检查时,会在该<header>部分指定样式并将其应用于所有组件

<header>
   // Stuff
   <style type="text/css">style for component About</style>
   <style type="text/css">style for component B</style>
   <style type="text/css">style for component C</style>
   // Stuff
</header>

如何将CSS导入为组件范围？好像我正在理解React ES6中的CSS导入错误.

我正在学习本教程

编辑

Brett的回答是正确的.但是,我的问题变成了其他地方.我使用create-react-app创建了我的应用程序,它基本上简化了做React所需的设置.它包括WebPack,Babel和其他要开始的事情.它使用的默认WebPack配置没有设置模块选项, …