rem 的官方定义『The font size of the root element.』,即以根节点的字体大小作为基准值进行长度计算。一般认为网页中的根节点是 html 元素,所以采用的方式也是通过设置 html 元素的 font-size 来做屏幕适配。
这里介绍一个自动把UI的px单位自动转换为rem单位的一个插件:
CSSREM
一个CSS的px值转rem值的Sublime Text 3自动完成插件。
插件效果如下:
安装
- 下载本项目,比如:git clone https://github.com/flashlizi/cssrem
- 进入packages目录:Sublime Text -> Preferences -> Browse Packages...
- 复制下载的cssrem目录到刚才的packges目录里。
- 重启Sublime Text。
配置参数
参数配置文件:Sublime Text -> Preferences -> Package Settings -> cssrem
-
px_to_rem
- px转rem的单位比例,默认为40。 -
max_rem_fraction_length
- px转rem的小数部分的最大长度。默认为6。 -
available_file_types
- 启用此插件的文件类型。默认为:[".css", ".less", ".sass"]。