CSS3不同平台兼容性增加了很多代码,人工实现兼容费时费力又容易出错。
好在神器webstorm内置了css3自动补全。当输入transform时,webstorm
会自动补全如下,nice:)
-webkit-transform: ;
-moz-transform: ;
-ms-transform: ;
-o-transform: ;
transform: ;
但是当我们从别处复制来的或者只有原生的时怎么办呢?
autoprefixer
autoprefixer可以实现css3代码自动补全。
详情见,https://github.com/postcss/autoprefixer
webstorm整合autoprefixer
打开设置,搜索external tools,点击绿色+号,
配置如下
Program是autoprefixer 的PATH,windows下可以用
where autoprefixer
参数如下
Program:填入你的PATH,我的是C:\Users\Administrator\AppData\Roaming\npm\autoprefixer.cmd
Parameters:$FileDir$$FileName$
Working directory :$ProjectFileDir$
配置快捷键
keymap 搜索 external tool, 配置 autoprefixer即可。 我配置的是
CTRL+SHIFT+ALT+P。
下次就可以直接CTRL+SHIFT+ALT+P一键转换了