尝试使用bootstrap作为依赖项：

npm i bootstrap

并导入到index.js中：

import 'bootstrap/dist/css/bootstrap.min.css';

甚至尝试React引导依赖

npm i react-bootstrap

Bootstrap是用! important规则编写的，所以如果给出的话，它们具有最高的优先级!也许你可以在React元素中尝试内联css（尽管在简单的HTML中不推荐）
一切顺利!

由于您还没有添加任何代码示例或您的实时项目的链接，请检查CSS文件是否已正确链接。转到页面源代码和点击styles.css。它应该打开CSS文件内的所有代码。如果您无法打开此文件，或没有找到任何内容，您应该再次检查CSS文件链接。但如果您可以看到css文件正确，但仍然无法工作，作为最后一个选项，你可以在CSS类中使用“！important”。2它会工作得很好。

1.使用npm i bootstrap将bootstrap安装为npm包，然后将您的styles.css放在src文件夹中，并将styles.css导入到您的App.jsx中。

import 'bootstrap/dist/css/bootstrap.min.css';
import './styles.css'

1.或者你甚至可以尝试使用!important。这肯定会起作用，但是每次你想覆盖一个样式时都需要使用它。

如前所述，bootstrap会将!important添加到所有内容中。为了删除所有这些内容，您需要安装npm包，而不是链接到CDN（就像您目前所做的那样）。
npm install bootstrap或yarn add bootstrap
然后创建一个app.scss（这里的命名是任意的）并添加以下行

$enable-important-utilities: false; //this disables !important
@import "../../node_modules/bootstrap/scss/bootstrap";

然后，将该app.scss文件导入index.js文件：
import './app.scss'
下一次运行npm start（或任何你正在使用的命令）时，它会生成一个新的css文件，如果你的项目还没有使用它，你可能需要安装sass，但是，这超出了这个答案的范围。