【angularjs】使用ionic+angular 搭建移动端项目，字体适配

解析：

　　　　首先，rem是以html为基准。

　　　　一般的，各大主流浏览器的font-size默认值为16px,此时1rem=16px。如果此时将rem与px进行换算很麻烦，比如0.75rem=12px。

　　　　为了更方便的进行换算（比如1：10），就可以加样式：

　　　　html,body{
  　　　　font-size: 62.5%;  
　　　　}

　　　　设置了62.5%以后就有 1rem=10px，便于用rem指定元素的尺寸（比如1.2rem=12px,1.4rem=14px），这样响应式的时候就可以直接改变font-size而无需计算其他各种样式中出现的尺寸了。

　　　　用rem定义尺寸的另一个好处是更能适应 缩放／浏览。

　　　　至于选择62.5%而非10px的原因，主要是兼容性和未来发展趋势的综合考虑，px这个单位的含义已经越来越混乱，几乎无法评估以后的设备是会一直像现在这样对网页上的px做兼容处理，还是让px回归“像素”的本意，

　　但62.5%代表默认字体尺寸的62.5%这个含义基本不会有混乱。

应用：　

　　html,body{
  　　　font-size: 62.5%;  
　　}

 ps:实际项目中uI给的设计图为二倍图，计算规则： 设计图尺寸/20 

 拓展：移动端的设计图为什么是二倍图？

　　网页设计图纸设计的是：物理像素，即：屏幕实际的像素点；

　　移动端显示的是：逻辑像素，即：手机屏幕可以现实的像素点。

　　例如：iPhone6 采用了 750*1334 分辨率的屏幕，逻辑像素是375*667。

 

作者：smile.轉角

QQ：493177502