rem单位是在移动端布局中最常使用的单位
通常做法是设置html{font-size:62.5%},然后使用媒体查询去改变不同尺寸设备的font-size值。
这样做的不足之处:每个文件都需要引用一大串的font-size值很繁琐,另外值并不能达到连续变化的效果。

这个时候可以引入一段js,通过识别设备尺寸来动态改变font-size值

var currClientWidth,fontValue,originWidth;
//originWidth用来设置设计稿原型的屏幕宽度(这里是以 Iphone 6为原型的设计稿)
originWidth=375;
__resize();
//注册 resize事件
window.addEventListener('resize', __resize, false);
function __resize() {
    currClientWidth = document.documentElement.clientWidth;
    //这里是设置屏幕的最大和最小值时候给一个默认值
    if (currClientWidth>640){currClientWidth = 640};
    if (currClientWidth<320){currClientWidth = 320};
    fontValue = ((62.5 * currClientWidth) /originWidth).toFixed(2);
    document.documentElement.style.fontSize = fontValue + '%';
}

本站以现代、古代情诗为主,情诗网创办于2013年,以原创爱情诗歌、经典情诗、现代情诗、古代情诗、英文情诗、情诗绝句为主并收集古诗、古诗词、诗歌大全、诗词名句的文学门户。方便您下次继续阅读;可以放在浏览器的收藏夹中(快捷键Ctrl+D);或者看到喜欢或者有趣的诗词可以通过分享按钮给你的好友分享;情诗网是目前最全情诗大全网站之一。并欢迎广大诗歌爱好者阅览投稿!喜欢本站的话请大家把本站告诉给你朋友哦!地址是 www.qingshiwang.com !