码迷,mamicode.com
首页 > 其他好文 > 详细

gulp插件autoprefixer

时间:2016-08-30 19:21:58      阅读:183      评论:0      收藏:0      [点我收藏+]

标签:

 gulp的autoprefixer插件可以根据我们的设置帮助我们自动补全浏览器的前缀(如:-moz、-ms、-webkit、-o)

  1)首先安装gulp,不知道怎么安装请看这里

  2)安装autoprefixer插件

  3)主要要在gulpfile.js文件引入autoprefixer,然后在添加autopre任务。完整代码如下

 1 // 载入外挂
 2 var gulp = require(‘gulp‘),  
 3     autoprefixer = require(‘gulp-autoprefixer‘);
 4 
 5 gulp.task(‘autopref‘, function () {
 6     //找到src目录下app.css,为其补全浏览器兼容的css
 7     gulp.src(‘css/basic.css‘)
 8         .pipe(autoprefixer({
 9             browsers: [‘last 5 versions‘, ‘Android >= 4.0‘],
10             cascade: true, //是否美化属性值 默认:true 像这样:
11             //-webkit-transform: rotate(45deg);
12             //        transform: rotate(45deg);
13             remove:true //是否去掉不必要的前缀 默认:true 
14         }))
15         //输出到dist文件夹
16         .pipe(gulp.dest(‘dist‘));
17 });

  4)antoprefixer()函数的参数介绍

    browsers:[]  (定义使用的浏览器版本)

    cascade : true  (定义对属性进行对齐操作)

    remove : true (去掉不必要的前缀) 

browsers的推荐值为:???

  

  

gulp插件autoprefixer

标签:

原文地址:http://www.cnblogs.com/yan-ck/p/5822957.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!