转载

一个使用最简单的px转rem预处理工具

如果你使用 Stylus 作为你的预处理CSS的工具，那么 px2rem 是你使用最简单处理 px 转 rem 工具，使用方法如此简单：

首先安装工具。 stylus-px2rem

npm install stylus-px2rem --save-dev

然后只要在你的 index.styl 文件引用就可以里

@import "node_modules/stylus-px2rem" div{      margin 24px 24px     font-size 14px     padding-bottom 12px     width 100px     height 100% }

Stylus 工具将 index.styl 编译成 index.css 并预处理将 px 转换成 rem 上面内容输出为：

div{     margin:1.5rem 1.5rem;     font-size:.875rem;     padding-bottom:.75rem;     width:6.25rem;     height:6.25rem }

默认 html-font-size ＝10px 你可以设置它。你可以设置部分样式转化，部分样式不转换成 rem ，你只需这么引用 styl 即可。这种方法 mixins 必须引用它

@import 'node_modules/stylus-px2rem/lib/mixins' @import 'node_modules/stylus-px2rem/lib/font-size' @import 'node_modules/stylus-px2rem/lib/border' @import 'node_modules/stylus-px2rem/lib/margin' @import 'node_modules/stylus-px2rem/lib/padding' @import 'node_modules/stylus-px2rem/lib/width' @import 'node_modules/stylus-px2rem/lib/height' @import 'node_modules/stylus-px2rem/lib/line-height'  html-font-size = 10px;  div {     margin 24px 24px     font-size 14px     padding-bottom 12px     width 100px     height 100% }

原文 https://segmentfault.com/a/1190000004923050

正文到此结束