Css 包括引导混乱

我用html和css制作了一个简单的汉堡按钮，一切都很好，但我需要在我的项目中包括对齐引导和所有内容，这不知怎么搞砸了我的css

不包括引导功能

包括引导后

我尝试在css样式表之前包含引导，这样它就不会过度使用它，但它不起作用

这是我的密码：

HTML

<button class="menuButton">
    <div class="buttonContainer">
        <span></span>
        <span id="midspan"></span>
        <span></span>
    </div>
</button>

---

这是因为默认的

bootstrap.css

文件覆盖了各种HTML元素的默认样式

如果您只想拥有一个没有样式的响应网格布局，您可以在HTML中包含

bootstrap grid.css

或

bootstrap grid.min.css

，这应该可以做到：

<link rel="stylesheet" href="css/bootstrap-grid.css">

你可以在他们的“编译包”中找到这些，可以下载

---

注意：此zip文件包含大量文件，只需使用

引导网格.css

或

引导网格.min.css

在任何具有良好开发工具（Firefox或基于Chomium的浏览器，有时称为F12开发工具）的浏览器中打开文件，右键单击该元素并检查它。您应该看到哪些规则正在影响它（通常在右侧）以及哪个文件包含所述规则（例如，您的CSS或引导）。也就是说，如果你只为一件事包含引导，为什么不把它和DIY放在一边呢？Bootstrap并不是专门为cherry picking特性设计的，它会影响大量其他元素，导致与您类似的冲突。请检查元素（之前/之后），然后更改添加的css，并确保您的元素没有包装在Bootstrap类中，例如

容器

读取Bootstrap源文件，您将找到诸如hr、h1-6、p、ul、ol、li等根元素的规则。将其引入现有站点肯定会带来麻烦。这是一种引导方式，或者根本不可能。

<link rel="stylesheet" href="css/bootstrap-grid.css">