base-scale

Scale layout flexibility.

Install

$ npm install base-scale

Usage

Webpack

import { setup, px2rem } from 'base-scale';
 
// setup
setup(750);
 
// call px2rem
px2rem(200);

px2rem must be called after setup.

API

setup(blueprintWidth = 750, gridNumber = 100)

• blueprintWidth: the width of blueprint in pixel.
• gridNumber: grid number.

px2rem(pixel)

• pixel: length in pixel.

Inspiration

• Rem 布局的原理解析
• 移动端高清、多屏适配方案
• 使用 Flexible 实现手淘 H5 页面的终端适配
• 移动端 Web App 自适应布局探索与总结
• 从网易与淘宝的 font-size 思考前端设计稿与工作流