SASS sprite 不能与 @extend 一起使用答案

【问题标题】：SASS sprite not working with @extendSASS sprite 不能与 @extend 一起使用
【发布时间】：2012-09-26 21:25:45
【问题描述】：

嗨，我在搞乱 SASS 和精灵，它工作正常。它从我的图像的文件名中生成了很多类，我可以在我的标记中使用它们。但我想在不更改标记的情况下使用精灵。

这就是我所拥有的

我的图片位于 images/raw 下其中一张图片名为spr-links.png

在我的 CSS 中

@import "raw/*.png"; //Sprite

我应该能够喜欢这个，但没有任何结果。 SASS 甚至没有失败

.footer{
    @extend .raw-spr-link;
}

【问题讨论】：

好吧我发现写法是这样的 @include raw-sprite(spr-links);但是输出是背景： url('/images/raw-s8e422df81e.png') no-repeat;我可以更改它以使其引用背景： url('../images/raw-s8e422df81e.png') no-repeat; ??

标签： sass sprite

【解决方案1】：

只需取消注释"relative_assets = true"

# Require any additional compass plugins here.

    # Set this to the root of your project when deployed:
    http_path = "/"
    css_dir = "css"
    sass_dir = "sass"
    images_dir = "images"
    javascripts_dir = "js"

    relative_assets = true

    output_style = :expanded # by Compass.app 
    sass_options = {:debug_info=>false} # by Compass.app 

    line_comments = true # by Compass.app

【讨论】：