Spree 3.1 CSS路径.spree-header background-image

Spree 3.1标准主题（开箱即用）Spree 3.1 CSS路径.spree-header background-image

我试图改变背景图片。但是不行。也许这条路是错误的。帮助需要。在这里，我做了什么。

上传图像为/app/assets/images/NewBackGroundImage.png
添加CSS在vendors/assets/stylesheets/spree/frontend/custom.css

CSS：

.spree-header{ 
    background-image: url("/assets/images/NewBackGroundImage.png"); 
    background-size: cover; 
    margin-bottom: 10px; 
}

这里我的检查当前的第

这部分是我的附加屏幕截图，用于评论下面的答案。

在检查屏幕它清楚地显示误差404（未找到）

试图改变利用资产URL然后

SCSS：

Then Chang Ë我custom.css到custom.scss

这是检查射击现在它的工作

来源

2016-11-11 T.Kul

因为你已经编写了'css'风格，所以不需要保存在'vendor'目录中 – illusionist

Hi魔术师。我试着把/app/assets/images/stylesheets/custom.css放到工作目录中，但不起作用。（背景和图片） –

你引用图片的方式是错误的.. inn SCSS你有类似'asset-url（asset_name ）'看到这个帮助http://www.rubydoc.info/github/petebrowne/sprockets-sass/master/Sprockets/Sass/Functions#asset_url-instance_method – illusionist

正如我所看到的，你的页面完全不使用你的风格。你确定div标签有类“spree-header”吗？因为在你的浏览器中它只有id“spree-header”而没有关于相应的类。尝试将其从.spree-header更换为#spree-header。如果有可能是风格之间的对抗，那么你可以尝试!important标签的用法：url(...) !important;

如果该文件夹“供应商”是在“应用程序”文件夹中，然后就可以使用相对路径url("../../../../../assets/images/NewBackGroundImage.png")以及

来源

2016-11-11 06:11:13

谢谢奥列格。在我改为＃spree-header背景颜色工作后，图片仍然没有显示。在Chrome浏览器=>检查样式（如附上我的＃spree头背景，那么原始的Spree 3.1变回蓝色背景，这意味着＃spree头是正确的，但url不起作用 –

最后它的工作：1.将.spree标题更改为＃spree-header（在我的情况下）2.将custom.css更改为custom.scss并3.将asset-url用于图像路径Big Thanks illusionist –

Spree 3.1 CSS路径.spree-header background-image

回答

相关问题