我正在使用gulp.spritesmith来自动化精灵图像和css生成.一切都很好,除了生成的css是haivng"icon-"前缀.我不想添加此前缀,因为我有现有的HTML标记,我不想更改标记.以下是我的gulp任务.
'use strict';
var gulp = require('gulp');
var spritesmith = require('gulp.spritesmith');
gulp.task('sprite', function () {
var spriteData =
gulp.src('./sprite/*.*') // source path of the sprite images
.pipe(spritesmith({
imgName: 'sprite.png',
cssName: 'sprite.css'
}));
spriteData.img.pipe(gulp.dest("./css")); // output path for the sprite
spriteData.css.pipe(gulp.dest("./css")); // output path for the CSS
});
Run Code Online (Sandbox Code Playgroud)
以下是我生成的CSS.
.icon-icon1 {
background-image: url(sprite.png);
background-position: 0px 0px;
width: 120px;
height: 120px;
}
.icon-icon2 {
background-image: url(sprite.png);
background-position: -120px 0px;
width: 120px;
height: 120px;
}
Run Code Online (Sandbox Code Playgroud)
请帮助压制"icon-".