Rails:如何在 Rails 4 中引用 CSS 中的图像 [英] Rails: How to reference images in CSS within Rails 4

问题描述

Heroku 上的 Rails 4 有一个奇怪的问题.编译图像时，它们会添加哈希值，但 CSS 中对这些文件的引用没有调整正确的名称.这就是我的意思.我有一个名为 logo.png 的文件.然而，当它出现在 heroku 上时，它被视为:

There's a strange issue with Rails 4 on Heroku. When images are compiled they have hashes added to them, yet the reference to those files from within CSS don't have the proper name adjusted. Here's what I mean. I have a file called logo.png. Yet when it shows up on heroku it is viewed as:

/assets/logo-200a00a193ed5e297bb09ddd96afb953.png

但是 CSS 仍然声明:

However the CSS still states:

background-image:url("./logo.png");

结果:图像不显示.有人遇到这个吗?如何解决?

The result: the image doesn't display. Anybody run into this? How can this be resolved?

推荐答案

Sprockets 与 Sass 一起具有 一些漂亮的帮手 可以用来完成工作.如果您的样式表文件扩展名为 .css.scss 或 .css.sass，Sprockets 将仅处理这些帮助程序.

Sprockets together with Sass has some nifty helpers you can use to get the job done. Sprockets will only process these helpers if your stylesheet file extensions are either .css.scss or .css.sass.

图像特定的助手:

background-image: image-url("logo.png")

<小时>

不可知论者:

background-image: asset-url("logo.png", image)
background-image: asset-url($asset, $asset-type)

<小时>

或者如果你想在css文件中嵌入图片数据:

---

Or if you want to embed the image data in the css file:

background-image: asset-data-url("logo.png")

这篇关于Rails:如何在 Rails 4 中引用 CSS 中的图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！