CSS指南针定制精灵名

Question

现在，如果我们使用指南针

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

我们在班级的CSS生病门这样

.imgs-<imagename> 

是有可能删除“IMGS”部分产生精灵的形象？我只需要.<imagename>

Answer 1

在这种情况下请勿使用神奇的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); 
    } 
}