AutoPrefixer

作者: 心彻 | 来源:发表于2017-06-20 11:01 被阅读547次

自动添加浏览器兼容前缀的插件。
以VS Code为例:
在应用商店里搜索扩展autoprefixer,如图:


搜索autoprefixer

点击安装。
然后就可以使用啦。
那么要怎么使用呢?比如我写一个样式如下:

.example {
  display: flex;
  transition: all .5s;
  user-select: none;
  background: linear-gradient(to bottom, white, black);
}

在VS Code编辑界面,右键,选择“命令面板”,或者ctrl+shift+P调出命令面板,输入autoprefixer关键字,点击一下:

使用AutoPrefixer

然后代码就变成带有浏览器兼容前缀的了,如下:

.example {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-transition: all .5s;
  transition: all .5s;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  background: -webkit-linear-gradient(top, white, black);
  background: linear-gradient(to bottom, white, black);
}

参考文章:
autoprefixer
AutoPrefixer
如何处理CSS3属性前缀
Compass用法指南

相关文章

网友评论

    本文标题:AutoPrefixer

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