zoukankan      html  css  js  c++  java
  • sublime text下安装插件autoprefixer

      有时候在写css样式的时候,分不清哪些属性需要前缀,哪些不需要,总是爱搞混淆了,于是autoprefixer这款插件便应运而生了。虽然在使用webpack的时候,我们可以很方便的使用这个,但是,如果项目比较小,或者是单纯的写几个页面,不想用webpack的时候,我们就可以在sublime text这款编辑器下安装autoprefixer这款插件了(前提是你的编辑器是sublime text)。

      (1)、安装:

      打开sublime text编辑器,Ctrl + shift + p,选择Install package,然后输入autoprefixer,即可开始安装。

      

      (2)、安装完后,并不能立即使用,还得配置一下快捷键,选择Preferences =》 Key Bindings,添加如下代码:

    [
    	{ 
    		"keys": ["ctrl+alt+shift+p"], 
    		"command": "autoprefixer" 
    	}
    ]
    

      

      (3)、选择Preferences => Package Settings => Autoprefixer,在文件右侧添加如下代码,如我的是这样的: 

    {
      "browsers": ["last 20 versions", "> 5%", "Firefox >= 10", "ie 6-11"],
      "cascade": true,
      "remove": true
    }
    

      其中last 20 versions表示浏览器最近的20个版本(这个数据可随意更改), 5%表示市场份额大于5%(百分比可随意),Firefox >= 10表示火狐浏览器版本大于或等于10

      好了,现在可以愉快地敲代码了。比如:

       .box { display: flex; } 

      选中上面这行代码,然后Ctrl + shift + alt + p,神奇的一幕发生了。代码变成这样了: 

    .box {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
    }
  • 相关阅读:
    CSS--盒子模型详解
    html元素分类
    HTML语义化(2016/3/16更新)
    如何在线预览github上的html页面?
    【鬼脸原创】谷歌扩展--知乎V2.0
    CSS选择器详解
    HTML基础知识
    python- 日志学习
    python-ddt 数据驱动测试
    python
  • 原文地址:https://www.cnblogs.com/jf-67/p/9182908.html
Copyright © 2011-2022 走看看