0

我正在使用Gulp-Compass 并希望缩小我的 CSS。

当我这样做时,以下代码

.tags-bar .sub-bullet:nth-last-of-type {
display:none; 
}

.ux-panel-hidden{
display:none;
}

缩小为:

.tags-bar .sub-bullet:nth-last-of-type,.ux-panel-hidden{display:none}

:nth-type部分使浏览器感到困惑,因此ux-panel-hidden无法读取。

带有缩小代码的 JSFiddle

具有非缩小代码的 JSfildde

tags-bar并且ux-panel在单独的 _scss 文件中,所以我不确定为什么 minfication 将它们放在一起。

我该如何解决?

这是我的 Gulp 代码:

gulp.task('compass', function() {
    return gulp.src('frontend/build/css/*.scss')
        .pipe(compass({
            css: 'frontend/dist/css',
            sass: 'frontend/build/css',
            image: 'frontend/images/',
            font: 'stylesheets/fonts',
            require: ['susy', 'breakpoint'],
            bundle_exec: true
        }))
        .pipe(plumber({
            errorHandler: onError
        }))
        .pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4'))
        .pipe(gulp.dest('frontend/dist/css'))
        .pipe(rename({
         suffix: '.min'
        }))
        .pipe(minifycss())
        .pipe(gulp.dest('frontend/dist/css'))
        .pipe(notify({ // Add gulpif here
            sound: "Pop"
        }));
});
4

1 回答 1

1

:nth-last-of-type不是有效的语法,因为它需要传递一个参数,例如。:nth-last-of-type(odd)

这可能会导致您的问题。

更多关于 CSS-Tricks 属性的阅读https://css-tricks.com/almanac/selectors/n/nth-last-of-type/

于 2015-06-29T10:41:15.927 回答