与资产管道的背景图像

Question

这应该是一件简单的事情，但由于某种原因它不会起作用。

我无法在页面上显示背景图像。 我正在使用Rails 3.2和资产管道。 我试图在与我的家庭控制器相关的页面上显示它。

图像位置是： app / assets / images / dna.jpg

home.css.scss

background: url('/assets/images/dna.jpg');

我也尝试过以下方法：

background: url('dna.jpg');
background: url('/assets/dna.jpg');
background-image: image-url("dna.jpg");
background-image:url(image_path('dna.jpg'));

无论我尝试哪种方法，我都会遇到同样的错误：

Sass::SyntaxError at /
Invalid CSS after "background:": expected pseudoclass or pseudoelement, was "   url('/assets/i..."

（在/Users/sean/Dropbox/bin/rails/assay/app/assets/stylesheets/home.css.scss中）

另请参阅此SO帖子： 在CSS中的Ruby on Rails 2中添加背景图像

编辑

参考这篇文章： sass-rails资产管道：错误地生成图像路径; `url（/images/blah.png）`而不是`url（/assets/blah.png）`

我清除了资产缓存

rake tmp:cache:clear

捆绑更新了我的sass-rails gem。 现在是3.2.6。 这些都没有任何区别。

Answer 1

我怀疑你的麻烦是一个非常简单的原因：缩进。 scss大部分时间都发生在语句之后没有空格，在你的情况下background: 。 在你的scss前缀文件中尝试这个：

background: url(dna.jpg);

它总是适合我。

Answer 2

我找到了解决办法：将scss文件转换为普通的css文件。

home.css

body {background-image:url('dna.jpg');
      background-size:cover;}

现在它工作正常。 它似乎不是正确的解决方案。

Answer 3

我有完全相同的问题，这是我在SCSS文件中使用Sass缩进语法的结果。

有关Sass和SCSS之间差异的更多信息： http ：//sass-lang.com/documentation/file.INDENTED_SYNTAX.html