rem-flexible

This is a fork of amfe-flexible

This package is published with some minor changes. The main function flexible can be passed two optional arguments. The first is design width, The second is pixel per rem.

Classic edition (0.3.2)

由于viewport单位得到众多浏览器的兼容，lib-flexible这个过渡方案已经可以放弃使用，不管是现在的版本还是以前的版本，都存有一定的问题。建议大家开始使用viewport来替代此方案。vw的兼容方案可以参阅《如何在Vue项目中使用vw实现移动端适配》一文。

Usage

Using unpkg

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<script src="//unpkg.com/rem-flexible"></script>
<script>
  // 设计稿宽度为750px，每1rem等于100px
  flexible(750, 100)
</script>

Using npm package

npm i rem-flexible

import in HTML file

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<script src="./node_modules/rem-flexible/dist/flexible.umd.min.js"></script>
<script>
  // 设计稿宽度为750px，每1rem等于100px
  flexible(750, 100)
</script>

or import esm module

import flexible from 'rem-flexible'
flexible(750, 100)

Related projects

• postcss-adaptive

Browser Compatibility

Changelog

See CHANGELOG.md