1

我有一个网站的 HTML/CSS 版本(基于 Bootstrap 构建),我正在将其翻译为 Rails 3 应用程序。

资产管道让我发疯。

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

其中一件事似乎是某些字体样式的覆盖。

例如,这就是 1h3的外观。

HTML 样式

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

导轨样式

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

我会喜欢任何关于如何找出这样做的原因的提示。

此外,困扰我的一件事是media=all该屏幕截图上的 Rails 版本。不确定这是否会导致这些问题。

编辑 1

正如@coreyward 指出的那样,这可能是我的样式表的初始化顺序。在我原来的 HTML/CSS 文件中,与 Bootstrap 和 Font-Awesome 相关的 css 在main.css. 但在 Rails 中,情况正好相反。

鉴于我最初的声明application.html.erb如下所示:

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

我如何颠倒这些东西的初始化顺序?

编辑 2

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

想法?

4

2 回答 2

1

包括屏幕和打印的media=all公正手段。如果您不关心网站在有人打印时的外观,那么您可以这样做media="screen"。至于为什么其中一些样式被这样覆盖。确保在您的资产管道中,您没有将脚手架.css 与require_tree .. 这通常会吸引很多人。此外,您不必包含整个 bootstrap_and_overrides 文件。= require twitter/bootstrap/bootstrap如果你只是想要那部分,你就可以。希望这能让你接近。

于 2012-12-28T06:11:53.673 回答
0

我将 gems 从 twitter-bootstrap-rails 切换bootstrap-sass到了twitter-bootstrap-rails,它允许我指定require指令的顺序。

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

于 2012-12-28T19:41:00.390 回答