为什么 Bootstrap 会破坏一些 CSS 代码？答案

【问题标题】：Why does Bootstrap breaks some css code?为什么 Bootstrap 会破坏一些 CSS 代码？
【发布时间】：2018-02-08 12:28:05
【问题描述】：

当我添加 bootsrtap 时，由于某些未知原因，使用本机 css 制作的东西没有显示在正确的位置。这是happens with bootstrap 和without。第二个也将发生在第一个上。请注意，这应该是一个人口金字塔，按女性（红色）和男性（蓝色）按年龄排序。

编辑：jsfiddle.net/64mjs03f/

【问题讨论】：

【解决方案1】：

我认为问题可能是由于标准化。

像 bootstrap 这样的库现在带有规范化的 CSS。这样做的目的是重置可能在不同浏览器中呈现不同的 HTML 元素的样式。

所有浏览器都有自己的 CSS 来呈现元素。规范化可帮助开发人员创建一个在所有浏览器中看起来都相同的 Web 应用。

【讨论】：

这是可能的，或者可能是 OP 只是在他们自己的之后包含了 Bootstrap css，所以它覆盖了他们的样式。如果没有 OP 向我们展示他们的代码，就不可能知道。
在那种情况下没关系。我都试过了（先是bs，然后是我的风格，反之亦然）。它没有区别。只有删除 bs css 文件才能修复它。
没关系，因为如果 Bootstrap 为按钮添加了填充，并且您没有覆盖按钮的填充属性，那也没关系。你现在唯一能做的就是调整你的 CSS 并尽可能使用 Bootstrap 类。
在使用 inscpect 和 css（网络工具）进行一些调整后，问题出在 box-sizing 上。我将其设置为初始值，现在一切都已修复。
box-sizing 仅由引导程序设置，是首选。你应该只使用它。