750设计图 px单位 / 100 = rem ;
使用时候写进header script 标签
/*** 自适应布局*/
initPageScale() || rem();
function initPageScale() {
var width = document.documentElement.clientWidth;
var height = document.documentElement.clientHeight;
//设置一个最小值，防止当浏览器里有top和bottom条时候，缩放比例太小
if (height < 520) { //height = 520; }
var ratio = 1;
var clientRatio = height / width;
var standardRatio = 1325 / 750; //视觉基准
if (clientRatio < standardRatio) { //扁屏幕要进行缩放处理
ratio = clientRatio / standardRatio; }
document.querySelector('html').style.fontSize = (document.documentElement.clientWidth / 750 * ratio) * 100 + "px";}
function rem() {
document.querySelector('html').style.fontSize = ((window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth) / 750) * 100 + "px";
}
rem-自适应兼容
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
- 文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
推荐阅读更多精彩内容
- H5-WebApp 自适应方案 - rem 对于WebApp来说，为了更通用地满足各机型屏幕的自适应布局要求，我们...
- 姓名：谢艾芳 学号：16040410073 转自http://www.jianshu.com/p/ee200a67...
