如何在 Ruby on Rails 中添加背景图片答案

【问题标题】：How to add background image in Ruby on Rails如何在 Ruby on Rails 中添加背景图片
【发布时间】：2015-06-23 01:32:16
【问题描述】：

我正在尝试将背景图像放入 ruby 应用程序中，我已经看到这个问题已经在其他帖子中得到了回答，但它对我没有用，我想知道我在哪里失败了。

我在 '/pubic/images' 和 'projectname/app/assets/images/' 文件夹中都有一个名为 background1.jpg 的背景，但它似乎不起作用。

例如，我一直在尝试直接从 html.erb

<div id="boxy" background-image="......."> </div>

但它没有用。所以我去了css，它是这样的：

boxy{
   ...
   background-image: url('projectname/app/assets/images/background1.jpg');

}

我也尝试在 css 的 url 路径中使用“public/images/background1.jpg”

注意：这不是文本代码，它只是一个表示。

这些方法都没有给我一个结果。我正在使用 Ruby 4.2.0

【问题讨论】：

【解决方案1】：

试试你的css：

#boxy{
  background: image-url('background1.jpg') no-repeat;
}

或者直接在你的视图中：

<%= image_tag('background1.jpg', style: "height: 30px; width: 30px") %>

【讨论】：

我已经尝试了各种方法，但是使用 image_tag 在视图中添加图像起到了作用，我不知道为什么当我从 css 应用它时它不起作用，但是谢谢跨度>
我自己对此很陌生，有两件事帮助我找到了这些问题的原因：1）开发日志文件，例如，它可能会显示加载图像时出错，这会告诉您由于某种原因它无法找到图像（因此是资产管道问题）。并且 2) 在 Firefox 中的 Tools>Web developer>Inspector 下（我相信其他浏览器也会有类似的东西），然后您可以在页面上选择一个元素，然后在右侧查看它适用于该元素的 css。这样，您可能会发现一个 css 正在覆盖另一个 css 指令。

【解决方案2】：

这对我有用。 background: url( asset-path('file-name.jpg') ) no-repeat

所以你的代码看起来像：

#boxy{
  background: url( asset-path('file-name.jpg') ) no-repeat;
  background-size: 100% 100%;
}

【讨论】：

【解决方案3】：

问题就这样解决了

添加图片是文件夹app/assets/image

在视图中

<%= image_submit_tag('nameimage.png') %>

缺点是不能随大小改变大小，但必须有你想出现的大小的图片

【讨论】：