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仍然声明:

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

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

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

推荐答案

链轮和Sass一起

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屋！