HTML和CSS的背景图像

i'n我的rails应用程序我改变页面的html部分（本地主机：3000 /饲料），在文件index.html.erb我设置背景这种方式HTML和CSS的背景图像

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"> 
    <html> 

    <head> 

     <style type="text/css"> 
      body 
      { 
      background-image:url("../../assets/images/wwi.jpg"); 
      } 
     </style> 

    </head> 
</html>

目录设置是这样的：

->app 
->assets 
    ->images 
    ->wwi.jpg 
->views 
    ->feeds 
    ->index.html.erb

但是当我启动rails服务器和去方言：3000 /供稿没有背景（我有背景颜色没有问题）

来源

2014-07-06 user3764449

您确保路径是正确的？ – Idris

您没有使用Rails资产管道的文档内部的意见。如果你看一下文档，它说

Asset pipeline concatenate assets, which can reduce the number of requests that a browser makes to render a web page. Web browsers are limited in the number of requests that they can make in parallel, so fewer requests can mean faster loading for your application

*所以，你应该用它和那首先删除所有从您的布局或视图的样式，你需要包括轨道在布局文件application.css通过

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

此标记将使轨使用的外观为您的风格里面资产/样式表/ application.css。现在，你需要通过

*= require style

要求您刚才提出，包括您的风格style.css.erb现在你style.css.erb里面你可以有你的风格是这样的：

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

更新：

如果你想用青菜代替那么你的文件将是style.css.scss，并且可以使用轨道image-url帮手，让你可以这样做：

body{ 
    background-image: image-url('wwi.png'); 
}

欲了解更多详情，请参阅rails asset pipeline

来源

2014-07-06 17:26:48 Mandeep

使用资产管道时，路径应相对于根假定

background-image:url("/assets/wwi.jpg");

图像。

您也可以使用资产帮手

<%= asset_path 'wwi.png' %>

我建议你写你的CSS阅读资产管道

http://guides.rubyonrails.org/asset_pipeline.html

来源

2014-07-06 15:45:20 Rafal

第一个示例在生产模式下不起作用（将md5指纹添加到文件名中）。应该推荐使用'asset_path'。 – mus

以及在何处以及如何使用 <％= asset_path 'wwi.png' ％> – user3764449

@ user3764449 http://guides.rubyonrails.org/asset_pipeline.html#css-and-erb – mus

HTML和CSS的背景图像

回答

相关问题