CSS Compass自定义精灵名称

时间:2012-11-08 16:07:05

标签: sass sprite compass-sass

现在,如果我们使用罗盘生成精灵图像

@import "imgs/*.png";
@include all-imgs-sprites;

我们在这样的.css课程中遇到了这个

.imgs-<imagename>

是否可以删除“imgs”部分?我只需要.<imagename>

1 个答案:

答案 0 :(得分:3)

在这种情况下,请不要使用神奇的all。这不方便,但工作正常。只需@import精灵和@include自定义类中的各个图片:

@import "imgs/*.png";

.circle {
    @include imgs-sprite('circle');
}

.square {
    @include imgs-sprite('square');
}

通过干涸来让你的生活更简单:

@each $file in circle, square {
    .#{$file} {
        @include imgs-sprite($file);
    }
}