fis3-postprocessor-cssreset
H5适配方案
why use fis3-postprocessor-cssreset?
fis3-postprocessor-cssreset 是一个fis3插件,用于将样式表中的px单位转换成rem单位,同时根据指定的dpr参数对数值进行缩放。如在默认参数下,fis3-postprocessor-cssreset将会对源代码进行如下转换。
source code
.container { width: 100%; height: 80px; margin: 0 30px; padding: 10px; font-size: 28px; color: #333; border: 1px solid #ddd;}
output code
.container { width: 100%; height: 2.5rem; margin: 0 0.9375rem; padding: 0.3125rem; font-size: 14px; color: #333; border: 1px solid #ddd;}
fis3-postprocessor-cssreset 支持批量指定属性的转换规则,并且内置了font和border,其中font相关属性只除去dpr值,不转换rem单位,而border相关属性既不除去dpr也不转换单位。你可以通过修改regain参数进行重置。
开始
npm install fis3-postprocessor-cssreset -g
fis;
参数介绍
rootFontSize
指定根节点字体大小, 默认为 16
fis;
ignore
对特定属性设置不转换规则
fis;
regain
恢复通过ignore设置的规则
fis;
Notice
- 由于采用单行分析,程序无法准确判断当前行是否被包含在注释中,因此
注释中的内容会被无条件转换
。 - 规则优先级 /*px*/ > reset > ignore
- css前缀将会被自动处理,在批处理属性中无需单独配置