(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);

引用这个js定下基数,

引自:http://www.jianshu.com/p/b00cd3506782

换算方法:http://pxtoem.com/

一般以56为基数

移动端使用rem方法的更多相关文章

  1. M端计算rem方法

    (function(){var a=document.documentElement.clientWidth||document.body.clientWidth;if(a>460){a=460 ...

  2. 移动端H5适配方法(盒子+图片+文字)

    一.怎么让H5页面适应手机 a.利用meta标签 <meta name="viewport" content="width=device-width,initial ...

  3. Axure中移动端原型设计方法(附IPhoneX和IPhone8最新模板)

    Axure中移动端原型设计方法(附IPhoneX和IPhone8最新模板) 2018年4月16日luodonggan Axure中基于设备模板的移动端原型设计方法(附IPhoneX和IPhone8最新 ...

  4. keyup在移动端失效解决方法

    keyup在移动端失效解决方法: $("#OBJ").on("input propertychange", function(){ }); 采用 input 与 ...

  5. viewport原理和使用和设置移动端自适应的方法(移动适应电脑)

    viewport原理和使用和设置移动端自适应的方法 HTML中: <meta name="viewport" content="width=device-width ...

  6. PHP防止被重复请求接口的方法(网页端签名验证的方法)

    PHP防止被重复请求接口的方法(网页端签名验证的方法) 可以采取签名验证的方式来 解决这个问题 1 time和随机数都是PHP生成的显示在前端 2 前端生成sign 3 进行每次请求的sign计数 这 ...

  7. 5种kafka消费端性能优化方法

    摘要:带你了解基于FusionInsight HD&MRS的5种kafka消费端性能优化方法. 本文分享自华为云社区<FusionInsight HD&MRSkafka消费端性能 ...

  8. 响应式布局rem、rem方法封装、移动端响应式布局

    相信大家在做移动端的时候都会做各个手机的适配这种适配就是响应式布局在之前做网站的响应式从pc到手机用的是媒体查询 @media screen and (max-width: 300px){} 最大宽度 ...

  9. 移动端使用rem适配及相关问题

    移动端适配方案,说多也很多.可以使用百分比布局,但百分比与em都是基于父元素进行计算的,在实际应用中不是很方便.使用rem不仅可以设置字体大小,块大小也可以设置.而且可以良好的适配各种终端,所以这方案 ...

随机推荐

  1. Zepto.js touch模块深入分析 解决手机点击事件

    源码: // Zepto.js // (c) 2010-2015 Thomas Fuchs // Zepto.js may be freely distributed under the MIT li ...

  2. JavaScript input type=file 获取文件大小及类型限制

    <input name="txtName" type="file" id="pic" onchange="loadImage ...

  3. 无废话MVC入门教程二[第一个小Demo]

    mvc技术交流,欢迎加群: 本文目标 1.了解"模型"."视图"."控制器"的创建.调试和使用过程. 本文目录 1.创建模型 2.创建视图 ...

  4. Window2003、xp远程备份数据库文件(xcopy+rar+pscp)

    Window2003.xp远程备份数据库文件 xcopy+rar+pscp .bat脚本 Eg: xcopy d:\dbtest\*.* d:\dbtemp\ /y D:\backup\Rar.exe ...

  5. 关于各种数据库 Insert时同时取到Id的操作

    对数据库的操作,在Insert的同时获取到Id,保证原子性操作.而不是,先取Id,然后再插入到数据库等操作. Oracle: 使用Oracle自带的 Returning into 语句,具体代码示例如 ...

  6. jquery读取本地文件

    <html> <head> <script type="text/javascript" src="/jquery/jquery.js&qu ...

  7. 6 支持向量机SVM

    注:理论部分参考:http://blog.csdn.net/v_july_v/article/details/7624837 (1)SVM是现成最好的分类器,这里“现成”指的是分类器不加修改即可直接使 ...

  8. JVM内存分配和回收

    本文内容来自<Java编程思想(第四版)>第二章<一切都是对象>和第五章<初始化与清理>.作为一个使用了好几年的Javaer,再次看编程思想的前面章节(不要问我为什 ...

  9. 在chart上加入一条指示线

    原文 http://hi.baidu.com/fuwei_bj/item/7e576410e970683db831801a <mx:AreaChart width="521" ...

  10. [Leetcode][Python]39: Combination Sum

    # -*- coding: utf8 -*-'''__author__ = 'dabay.wang@gmail.com' 39: Combination Sumhttps://oj.leetcode. ...