请教下 react 移动端 怎样用rem适配

#1

最近公司技术选型,本人打算用react来构建移动端,请问下 是跟普通 页面一样 引入适配方法就好,还是要用其他方法

#2

我们目前所有React项目里用的像素基本上都是 px ,感觉还好样的。

#3

手机上px 没问题么?

#4

可以使用淘宝的flexible.js

#5

一种常用的移动端适配方式是:设计师出一份640的设计稿,media 414以下使用一倍图,media414以上使用1.5倍图,比如iPhone5和iPhone6上body设置为12px,在iPhone6 plus设置body为18px,5和6使用的就是一倍图设计。

比如有段文字在5和6显示12px,那么字体大小设置为1rem,到了6 plus,1rem代表的就是18px。

当然,不同的网站需要做的适配效果不一定一样,有的是移动端不做任何适配,有的按照1.5倍方案来做,有的还针对iPhone5、6、6plus各做适配。

淘宝移动端做了一件神奇的事情,在iPhone5、6设置了body24px,在iPhone6 plus设置body36px,然后在head的meta属性分别设置了缩放比例0.5和0.3333,最后换算的结果就是,实际字体大小压根没变。这么做估计是设计师出的设计图是640的一倍图,为了好换算,就直接使用一倍图的基准24px做开发了。

#6

感谢,大神指导