css - compass Sprite - 在包含 Sprite 时避免使用扩展

Question

我正在使用 Compass 生成我的 Sprite ，它工作得很好，但我遇到了一个小麻烦。当在另一个 @include 中时，我无法使用 @include 语句包含单个 sprite，例如我常用的媒体查询混合。我的 Sprite SCSS 看起来像这样:

.sp {
    background-repeat: no-repeat;
    overflow: hidden;
    line-height: 0;
    font-size: 0;
    text-indent: 100%;
    border: 0;
}

$sp-sprite-dimensions: true;
$sp-sprite-base-class: '.sp';
$sprite-layout: smart;
@import "sp/*.png";
@include all-sp-sprites;

在另一个地方，我正在尝试这样做:

.logo {
    a {
        @include break($break1) {
            @include sp-sprite(logo-small);
        }
    }
}

SCSS 可以使用嵌套的@include 语句，但它不允许在@include 语句中使用@extend 语句，显然 Sprite @include 正在幕后生成@extend 语句，这是我不想要的。有人知道解决这个问题的方法吗？

编辑:

@lolmaus 引起了我的注意，真正的问题是我在媒体查询中嵌套了一个@extend。我想这是不允许的，有什么办法吗？

Answer 1

在媒体查询中使用 compass Sprite 是不可能的，至少在文档中是这样描述的。

有几个解决方法:

• creating sprites manually通过命令行；
• 使用custom mixin .