(function (doc, win) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function () {
var clientWidth = docEl.clientWidth;
if (!clientWidth) return;
if(clientWidth>=640){
docEl.style.fontSize = '100px';
}else{
docEl.style.fontSize = 100 * (clientWidth / 640) + 'px';
}
}; if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);
宽640的设计稿,这样设置后,10px相当于0.1rem 100px相当于1rem 1:100的关系

rem布局js设置,设置网页文档参考字体闭包函数的更多相关文章

  1. jquery.cookie 使用文档,$.cookie() 文档教程, js 操作 cookie 教程文档。

    jquery.cookie 使用文档,$.cookie() 文档教程, js 操作 cookie 教程文档. jquery.cookie中的操作: jquery.cookie.js是一个基于jquer ...

  2. JS第二部分--DOM文档对象模型

    一.DOM的概念 二.DOM可以做什么 三.DOM对象的获取 四.事件的介绍 五.DOM节点标签样式属性的操作 六.DOM节点对象对值的操作 七.DOM节点-标签属性的操作(例如id class sr ...

  3. Babylon.js官方性能优化文档中文翻译

    在这里列出Babylon.js官方性能优化文档的中英文对照,并在CardSimulate项目里对其中的一些优化方法进行实践. How To 如何 Optimize your scene 优化你的场景 ...

  4. js/css在html文档中的引用外部文件方式对比

    包含css样式表和js脚本的最好方式是使用外部文件,因为css/js和html标记文档可以清晰地分离. css的外部引用写在<head></head>中: <head&g ...

  5. jQuery+turn.js翻书、文档和杂志3种特效演示

    很好用的一款插件jQuery+turn.js翻书.文档和杂志3种特效演示 在线预览 下载地址 实例代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML ...

  6. 获取网页文档的URL和连接来源

    <script type="text/javascript">document.write("链接来源:"+document.referrer+&q ...

  7. 《网页文档/文字复制方法大全》 - imsoft.cnblogs

    <网页文档/文字复制方法大全> 一: 1.首先,找到自己要的文档. 2.文章题目复制,在搜索引擎的框框里输入:site:wenku.baidu.com "题目"/sit ...

  8. HTML5网页文档结构

    2.1     Web标准 Web标准,使得Web开发更加容易.Web标准由万维网联盟(W3C)制定. 2.1.1          Web标准概述 Web标准的最终目的就是保证每个人都有权力访问相同 ...

  9. GitBook的使用方式,快速创建网页文档

    环境需求:node npm 得装好 ----------------------------------- 我一开始不知道得先装gitbook-cli 先执行了 npm install gitbook ...

随机推荐

  1. 021_supervise进行管理利器

    一.公司的类似ansible的工具也是用supervise管理的 [admin@mjyall-test-1 /service/ansible-oc-agent]$ ps -ef|grep 19070 ...

  2. 通信——基于Xmpp协议实现的聊天室

    前段时间写了个自定义通信协议的聊天室(即用\r\n标记字符串,作为一句话),总感觉自己弄的那个协议实现虽然简单,但是拓展性就太差了,只适合于发送聊天的内容,难以包含更多的信息.基于上述几点,于是就开始 ...

  3. 大数据mapreduce俩表join之python实现

    二次排序 在Hadoop中,默认情况下是按照key进行排序,如果要按照value进行排序怎么办?即:对于同一个key,reduce函数接收到的value list是按照value排序的.这种应用需求在 ...

  4. 处理:“ORA-00257: archiver error. Connect internal only, until freed”的错误问题

    注:本文参考了< ORA-00257: archiver error. Connect internal only, until freed 错误的处理方法  > 一:问题背景: 今天在 ...

  5. ORA-00845 MEMORY_TARGET not supported on this system 的解决

    本文来源:宁静致远 的<ORA-00845 MEMORY_TARGET not supported on this system 的解决> oracle11g数据库在执行dbca或者调整s ...

  6. Confluence 6 允许其他用户编辑站点欢迎消息

    你可以通过使用 Include Page 宏从你站点其他页面中包含内容,而允许其他不是 Confluence 管理员的用户编辑站点欢迎消息.使用这种方式能够避免直接对模板文件中的内容进行编辑. 从站点 ...

  7. RefineDet训练自己的数据

    https://github.com/sfzhang15/RefineDet 1.编译安装 cp Makefile.config.example Makefile.config make all -j ...

  8. ionic3 启动白屏处理

    重点就就三点 1.设置不自动隐藏splashscreen页面,设置最多延迟10s再关闭,这样可以不显示启动前的白画面 <preference name="AutoHideSplashS ...

  9. Best Free Hacking E-Books 2017 In PDF Format

    1.Best Free Hacking E-Books 2017 In PDF Format: 电子书籍下载地址 后续我会更新在我的百度云资源 上,需要的留言Black Belt Hacking &a ...

  10. Android Studio 配置虚拟设备的镜像文件的存放路径

    操作系统:Windows 10 x64 IDE:Android Studio 3.3 Android Studio创建的虚拟设备的默认存放路径是位于C盘,这导致C盘的可用容量变小. 所以,我决定要将虚 ...