美文网首页
Autoprefixer-css神器

Autoprefixer-css神器

作者: jrg陈咪咪sunny | 来源:发表于2018-09-27 12:24 被阅读0次

处理CSS前缀问题的神器——AutoPrefixer。AutoPrefixer官网

Autoprefixer是一个后处理程序,不象Sass以及Stylus之类的预处理器。它适用于普通的CSS,可以实现css3代码自动补全。也可以轻松跟Sass,LESS及Stylus集成,在CSS编译前或编译后运行。

Autoprefixer 同样会清理过期的前缀,因此下面的代码:
css 代码:

a {
-webkit-border-radius : 5px;
border-radius : 5px
}

编译成:

css 代码:

a {
border-radius : 5px
}

因为经过Autoprefixer处理,CSS将仅包含实际的浏览器前缀。

1.首先当然是安装node.js;

(略)

2.安装Autoprefixer,

https://github.com/postcss/autoprefixer

mac:

  sudo npm install autoprefixer -g

要不要加sudo,或者是不是全局安装(-g)那就看你自己的环境了。
win:

npm install --save -dev autoprefixer

npm太慢,我是用淘宝的 NPM 镜像的https://npm.taobao.org/

3.安装postcss-cli

Autoprefixer其实是postcss的插件,见https://github.com/code42day/postcss-cli

ps:为兼容所有浏览器,有的CSS属性需要对不同的浏览器加上前缀,然而有时添加一条属性,需要添加3~4条类似的属性只是为了满足浏览器的兼容,这不仅会增加许多的工作量,还会使得你的思路被打断。

相关文章

网友评论

      本文标题:Autoprefixer-css神器

      本文链接:https://www.haomeiwen.com/subject/rekeoftx.html