我怎样才能找出哪种风格覆盖了另一种风格？

Question

我有一个网站的HTML / CSS版本（基于Bootstrap构建），我正在翻译成Rails 3应用程序。

资产管道让我发疯。

由于gem生成的bootstrap_and_overrides.css.scss文件，它在我的Rails应用程序中显示的方式与常规HTML文件之间存在冲突。

其中一个似乎就是覆盖了某些字体样式。

这就是1 h3应该看起来的样子。

这就是在我的Rails应用程序中呈现相同的h3。

因此，页面显示方式的问题在于这些特定的样式....但我无法弄清楚为什么要覆盖这种样式。

我很想知道如何找到为什么要这样做的提示。

另外，有一点让我烦恼的是该屏幕截图中Rails版本中的media=all。不确定这是否会导致这些问题。

修改1

正如@coreyward指出的那样，它可能是我的样式表初始化的顺序。在我原来的HTML / CSS文件中，Bootstrap＆amp; Font-Awesome相关的css在main.css之前声明。但是在Rails中，这是相反的方式。

鉴于我在application.html.erb中的初始声明如下：

<%= stylesheet_link_tag "application", :media => "all" %>

如何撤消初始化这些事情的顺序？

修改2

我正在使用此bootstrap-sass gem，问题是它不希望您使用//=require指令 - 所以我不能只重新安排CSS清单文件中的顺序。或者更确切地说，我不知道该怎么做。

思想？

Answer 1

media=all只是意味着包含屏幕和打印。如果您不关心网站打印时网站的外观，那么您可以media="screen"。至于为什么有些这样的风格被这样覆盖。确保您的资产管道中没有包含require_tree .的scaffold.css。这通常会吸引很多人。此外，您不必包含整个bootstrap_and_overrides文件。如果你只是想要那部分，你可以= require twitter/bootstrap/bootstrap。希望能让你接近。

Answer 2

我将宝石从bootstrap-sass切换到twitter-bootstrap-rails，这允许我指定require指令的顺序。

在玩完指令的正确排序之后，我终于找到了一个似乎解决了我的问题。