<分区>
默认情况下，bootstrap 有 box-sizing 并破坏了我的布局，我无法禁用它:
#menu_items {
-webkit-box-sizing: content-box !important;
-moz-box-sizing: content-box !important;
box-sizing: content-box !important;
width: auto;
list-style-type: none;
margin: 0px;
padding: 0px;
}
这个提示不起作用，删除 box-sizing 布局后工作正常
问题:
如何在我自己的布局上禁用此功能并禁用in-herit
最佳答案
BootStrap 默认在所有元素上设置边框:
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
要覆盖它，只需确保您的自定义 CSS 文件在您的站点中的 BootStrap 之后被引用，并将其设置回默认的 content-box :
* {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
*:before,
*:after {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
检查这个 fiddle :https://jsfiddle.net/movs6gw0/1/
我将 BootStrap CSS 文件添加为资源，如果您检查我放在 p 标签中的内容，您会注意到 BootStrap 的边框样式在 *(所有)元素已被我放在上面的内容覆盖。
CSS 是“级联的”，这意味着您声明的任何样式都可以被 CSS 文件/文档中的相同样式声明覆盖。除非绝对重要，否则无需使用 !important，在我看来这违背了 CSS 的哲学。
以下面的例子为例:https://jsfiddle.net/av4jbyt6/
<p>
Test content
</p>
CSS:
p {
color: white;
}
p {
color: red;
}
上面的两种样式都引用了相同的元素 (p)，但是最终的样式覆盖了之前的样式，因为它在链的下游...
关于CSS 禁用 bootstrap box-sizing，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34790054/
相关文章：
ios - Bootstrap 3:表单焦点之后iPhone上的水平滚动条
css - 从 bootstrap 3 中的 Select 标签中删除边框半径
javascript - Bootstrap 没有响应，但我有元标记
javascript - 如何为每个 block 设置一个事件类？ [Javascript]
javascript - 不同标题长度的 Bootstrap Tabs 有不同的高度
css - 基金会 : Way to offset inner columns as much as outer columns?