flexible.js使用方式

flexible.js是一款用于移动端自适应布局的JavaScript库，可以根据不同设备的屏幕大小动态设置HTML根元素的字体大小，以达到适应不同屏幕的效果。

使用步骤如下：

1. 在HTML中引入flexible.js，可以通过CDN方式引入或者下载到本地后引入。

<script src="https://cdn.bootcdn.net/ajax/libs/flexible.js/0.4.0/flexible.min.js"></script>

2. 在CSS中使用rem单位代替px单位进行布局，例如：

body {
  font-size: 14px; /* 以14px为基准 */
}

.box {
  width: 2rem; /* 相当于28px */
  height: 1rem; /* 相当于14px */
}

3. 在JS中可以通过Flexible.dpr获取当前设备的dpr值，以及Flexible.rem获取当前设备的1rem大小。

console.log(Flexible.dpr); // 获取当前设备的dpr值
console.log(Flexible.rem); // 获取当前设备的1rem大小（单位px）

需要注意：

1. 在使用flexible.js时，不要直接给HTML、BODY等元素设置字体大小，否则会影响到flexible.js的效果。

2. 在使用flexible.js时，要保证设计稿使用的尺寸单位为px，而不是pt、em等其他单位。因为flexible.js只能识别px单位。

3. 在使用flexible.js时，要根据设计稿的尺寸进行计算，例如设计稿宽度为750px，那么1rem应该等于设计稿宽度的1/75，即10px。

希望对你有帮助。