如何在导轨上显示红宝石背景图像

我正在运行ruby 2.3.0和导轨5.0。当试图在一个视图中显示的背景图像，我用下面的CSS类：如何在导轨上显示红宝石背景图像

.header_img{ 
    width:100%; 
    height: 400px; 
    background: url("../../assets/images/home/home-header.jpg"); 
}

图像位于下的主文件夹资产配方食品中。我试图在这里找到一个解决方案，但一直没能找到一个工作任何帮助将是真棒。

我正在使用Rubymine作为我的IDE，似乎没有任何工作。

2016-09-15 John Bome

无需提供绝对路径为你的形象是在资产产生这样你就可以直接做这样的事情

background-image: url('image.png')

2016-09-15 03:04:31

这对我不起作用。它所做的就是在代码中给我这个background-image：url（'image.png'） –

可以请你试试像这样background-image：url（“../../ assets/images/home/home- header.jpg“）通过给绝对路径 –

这并不起作用 –

你应该看一看资产管道，请参阅“2.3.1 CSS和ERB“：

资产管道自动评估ERB。这意味着如果你添加的ERB扩展到CSS的资产（例如，application.css.erb），然后像asset_path助手在你的CSS规则可供选择：

.class { background-image: url(<%= asset_path 'image.png' %>) }

2016-09-15 05:46:10 Roger

我的IDE说找不到asset_path –

@JohnBome您是否将css重命名为css.erb？如果您运行该应用程序，css的外观如何。（检查来源）？ – Roger

您可以使用IMAGE_URL帮手而无需将该文件重命名为.erb。你只需要添加扩展名.scss。例如。 main.css.scss并添加一行：

background-image: image_url('/home/image.png')

2016-09-15 10:26:51

我有home.scss和助手不工作 –

我有一个类似文件夹结构，你，我已经成功地使用背景图片。

有这样的代码的尝试，而不是看它是否工作

background-image:url('/assets/home/home-header.jpg');

也只需额外的，如果你想有一个固定的，不重复的背景覆盖图像的整个页面下方添加这个CSS ^该行

background-size:cover; 
background-repeat:no-repeat; 
background-attachment:fixed; 
height:100%;

2016-09-15 10:44:16

我仍然没有太多运气。我使用红宝石作为我的IDE，我得到无法解析文件。 –

回答