为什么在Bootstrap CSS中对这1行进行例外？

Question

Bootstrap CSS的启动模板包括以下内联：

body {
    padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
}

有哪些实际原因是将这种样式列入串联，而所有其他代码都位于外部.css文件中？

Answer 1

内联风格是故意插入的 bootstrap.css 和 bootstrap-responsive.css. 。将其移动到 main.css （之后 bootstrap-responsive.css）至少在IE 10和Chrome 22中，将显示黑色菜单栏上方的填充物。

理想情况下，它应该添加到 bootstrap.css 但这不是出于某种原因。

另一个解决方案是将其放入单独的CSS文件中，但这需要下载一个非常小的文件。

加载 main.css 两者之间 bootstrap*.css 文件将使覆盖特定设置更加困难。

所以我认为这是一个妥协。

Answer 2

可能有几种情况，

• 也许他们希望该规则覆盖外部样式表中声明的任何内容（除了 !important 规则）。作为内联 <style> 元素自动认为更具体。
• 也许他们希望此特定规则是此页面唯一的，而不是整个网站上的全球可用。 60px TOPBAR可能仅在该页面上存在。