工商注册网站官网,网页制作素材免费网站,网络工程专业毕业生设计,网站建设微信运营销售有时候在写css样式的时候#xff0c;分不清哪些属性需要前缀#xff0c;哪些不需要写前缀#xff0c;sublime text这款编辑器下安装autoprefixer这款插件可以省去很多问题#xff0c;写起来也很方便。1 确保系统已经安装node.js 可直接去官网上下载并安装#xff0c;我的系… 有时候在写css样式的时候分不清哪些属性需要前缀哪些不需要写前缀sublime text这款编辑器下安装autoprefixer这款插件可以省去很多问题写起来也很方便。1 确保系统已经安装node.js 可直接去官网上下载并安装我的系统是win7只能安装低版本的node.js 官网https://nodejs.org/en/download 老版本https://nodejs.org/en/about/previous-releases 我下载版本的是v13.14.0 https://nodejs.org/download/release/v13.14.0/ 根据自己系统选择 我的是64位直接选择node-v13.14.0-x86.msi 下载 根据提示安装即可。 安装成功后在命令行执行node -v和npm -v 查看当前版本 2 sublime text下安装插件autoprefixer 打开sublime text编辑器Ctrl shift p选择Install package然后输入autoprefixer即可开始安装。安装完后并不能立即使用还得配置一下快捷键选择Preferences 》 Key Bindings,添加如下代码
[{ keys: [ctrlaltshiftp], command: autoprefixer }
]选择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
编辑代码 .demo { display: flex; } ctrlaltshiftp 会提示错误如下图 找到sublim安装插件的目录 找到autoprefixer目录进入之后删除node_modules目录和package-lock.json文件删除之后进入命令行cd到autoprefixer插件目录 按照提示执行npx browserslistlatest --update-db 执行完之后还是会报错根据提示执行npm install caniuse-lite 这时候在测试代码再次执行 ctrlaltshiftp
.box {display: -webkit-box;display: -webkit-flex;display: -moz-box;display: -ms-flexbox;display: flex;
}最终sublim会根据CSS样式自动补上前缀
