标签：尺寸 计算 java 比例 div 计算公式 iphone5s var 竖屏
以设计稿为准，假设设计稿竖屏宽度为750px，取根元素的font-size为50px
在iphone6(375px)下，deviceWidth=7.5rem, 这个就是viewPort中的deviceWidth，
所以fontsize计算公式为 font-size=deviceWidth/7.5 即50px，因此我们可以设置iphone6下 html的font-size为312.5%
在该尺寸下的设备上，如果要设置某个p元素的字体大小为18px，可以设置成0.36rem
在iphone5s 320px,按比例换算，font-size=320/7.5=85.33 或者(320/375)*50px
可以使用下面这个方法动态计算根元素字体大小：
!function(){
var htmlEl = document.getElementsByTagName(‘html‘)[0];
var fitPage = function(){
/* The calculate of with from zepto */
var w = htmlEl.getBoundingClientRect().width; //返回一个DOMRect对象
w = Math.round(w);
w = w > 750 ? 750: w;
var newW = w/750 * 100;
htmlEl.style.fontSize = newW + ‘px‘;
}
fitPage();
var t;
var func = function(){
clearTimeout(t);
t = setTimeout(fitPage, 25);
}
window.addEventListener(‘resize‘, func);
}();
注：需要在html中有下面的声明，width=deviceWidth
<meta name="viewport" content="width=deviceWidth,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
标签：尺寸 计算 java 比例 div 计算公式 iphone5s var 竖屏
原文地址：http://www.cnblogs.com/lydialee/p/7063115.html
