根据设备dpr设置fontSize

翻了半天简书,试了不少这种代码,结果还是找到自己以前的有效果,东西果然还是自己的好用 (-_- !

<script type="text/javascript">

;(function(doc, win) {

var docEle = doc.documentElement,

dpr = Math.min(win.devicePixelRatio, 3),

scale = 1 / dpr,

resizeEvent = 'orientationchange' in window ? 'orientationchange' : 'resize';

var metaEle = doc.createElement('meta');

metaEle.name = 'viewport';

metaEle.content = 'initial-scale=' + 1 + ',maximum-scale=' + scale;

docEle.firstElementChild.appendChild(metaEle);

var recalCulate = function() {

var width = docEle.clientWidth;

docEle.style.fontSize = 10 * (width / 375) + 'px';

};

recalCulate();

if (!doc.addEventListener) return;

win.addEventListener(resizeEvent, recalCulate, false);

})(document, window);

</script>

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 以下是常用的代码收集,学习用。转自豪情博客园 1. PC - js 返回指定范围的随机数(m-n之间)的公式 re...
    自由加咖啡阅读 1,029评论 0 1
  • 移动端应该如何动态设置字体大小? rem由来:font size of the root element,那么re...
    a8d1e9528b1e阅读 521评论 0 0
  • 一:基于mpvue框架html可以用原生标签和模板自定义标签 二:css编译器是sass 三:小程序的css的px...
    kknew阅读 1,690评论 0 0
  • 方案一: 最新方案:(隆重推荐) 1、下载MateHandler.js,并引入页面2、head里加入 3、设置bo...
    晨光2016阅读 925评论 0 0
  • 《素问、上古天真论》说:美其食,任其服,乐其俗。意思是说,吃什么东西都觉得好吃,穿什么衣服都觉得舒服,在什么样的环...
    乐融䣓䣓阅读 224评论 0 0