Css -网络工具包盒方向:垂直;在sass中,不是在gulp中编译的
在sass文件中Css -网络工具包盒方向:垂直;在sass中,不是在gulp中编译的,css,sass,gulp,Css,Sass,Gulp,在sass文件中 h3 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; line-height: 24px; max-height: 24px; -webkit-line-clamp: 1;
h3 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
line-height: 24px;
max-height: 24px;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
运行gulp任务后,作为
.article-list.search .article-listings__item h3 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
line-height: 24px;
max-height: 24px;
-webkit-line-clamp: 1;
}
样式-webkit框方向:垂直
我的sass编译任务是
gulp.task('styles', function() {
return sass('src/assets/stylesheets/index.scss', { style: 'expanded' })
.pipe(autoprefixer('last 2 version'))
.pipe(gulp.dest('dist/styles'))
.pipe(rename({ suffix: '.min' }))
.pipe(cleanCSS())
.pipe(gulp.dest('dist/styles'))
.pipe(notify({ message: 'Styles task complete' }));
});
看看这个
像这样配置autoprefixer。希望它能帮助你
autoprefixer({
remove: false,
browsers: ['last 2 versions']
})
添加这行代码,它将正常工作:
/* autoprefixer: off */
-webkit-box-orient: vertical;
/* autoprefixer: on */
如上所述,此方法非常有效
/* autoprefixer: off */
-webkit-box-orient: vertical;
/* autoprefixer: on */
出于我的目的,我正在搜索一些插件帮助,因为它不包括-webkit-box-orient
属性。我可以确认这个方法也适用于插件
我相信它必须处理插件似乎在引擎盖下使用自动前缀的事实。这是一个真正适合我的插件
/*! autoprefixer: off */
-webkit-box-orient: vertical;
/* autoprefixer: on */
使用的sass版本是gulpruby-sass:2.1.1这是唯一一个适合我的版本。