这段js 需要置于页面上端 也就是 需要先加载js然后加载页面 (这段js是原生js而且比较短小 基本对页面加载速度无影响)

FontResize : function(maxWidth){
(function() {
function o() {
document.documentElement.style.fontSize = (document.documentElement.clientWidth > maxWidth ? maxWidth: document.documentElement.clientWidth) / (maxWidth/200)+ "px";
}

var e = null;
window.addEventListener("resize", function() {
clearTimeout(e), e = setTimeout(o, 100)
}, !1), o()
})(window);
}

maxWidth 是传入进来的页面设计尺寸 ,一般的设计稿尺寸为750px  那么此时就传入750

然后html的字体大小是100px  这时候可以根据页面的px设置rem值 ,比如页面p 的字体大小为 18px 那么我们设立的值是 0.18rem

.

fontresize 移动端的手机字体 大小设置的更多相关文章

  1. eclipse护眼颜色和字体大小设置

    ♣eclipse护眼颜色和关键字颜色设置 ♣eclipse字体大小设置(包括jsp , .xml ,.java) 1.Eclipse字体大小调整: 窗口(Window)-首选项(Preferences ...

  2. eclipse中的字体大小设置和背景色设置

    1.字体大小设置 在basic下选择最后一个TextFont 护眼背景色设置 添加到自定义颜色后点确定 最后一步点apply

  3. hotcss.js Flexible 移动端适配在dpr=2和dpr=3出现的字体大小设置不正确问题.

    这段时间一直在用hotcss做移动端适配,做了几个页面没有发现什么问题,后来老大要加快进度,我把项目分出一块给另一个同事做,她发现了一个问题就是字体在dpr=2,dpr=3,的设备上字体大小显示老是不 ...

  4. 移动端rem布局,用户调整手机字体大小或浏览器字体大小后导致页面布局出错问题

    一.用户修改手机字体设置大小,影响App里打开的web页面. 手机字体设置大小,影响App的页面.Android的可以通过webview配置webview.getSettings().setTextZ ...

  5. html5移动端页面分辨率设置及相应字体大小设置的靠谱使用方式

    对于html5移动端网页编写CSS网上有很多介绍的文章,但在实际使用过程中还是会纠结. 网上的资料太多,且大多都是技术介绍型,特别是针对android上,网上写的各种麻烦,各种复杂,各种不接地气儿.. ...

  6. rem布局,在用户调整手机字体大小/用户调整浏览器字体大小后,布局错乱问题

    一.用户调整浏览器字体大小,影响的是从浏览器打开的web页. 浏览器设置字体大小,影响浏览器打开的页面.通过js可控制用户修改字体大小,使页面不受影响. (function(doc, win) { / ...

  7. Eclipse字体大小设置

    打开Eclipse,在主界面下Window->Preferences->General->Appearance->Colors and Fonts, 然后在右边展开框Basic ...

  8. CSS字体大小设置时的参考(转)

    from:http://blog.sina.com.cn/s/blog_51cd580b0100gg6y.html font-size 设置的绝对关键字: 以下几个绝对字体大小的设置是有效的.当然他们 ...

  9. css字体大小设置em与rem的区别

    em 单位em是相对于父元素的,如果父元素没有设置字体大小,那就会追溯到body. 比如  如果我在box_text的父元素box加了一个字体大小   那么body的8px就会被box_text的父元 ...

随机推荐

  1. python的工作记录A

    马上进入工作自动化: [root@localhost ~]# cat svn_bbs.py import os,sys,commands,subprocess import re,time svnUr ...

  2. Android项目的图标

    项目的图标就是在AndroidManifest.xml中通过android:icon="@drawable/ic_launcher"来指定的,ic_launcher这张图片可以放在 ...

  3. Altium中Fill,Polygon Pour,Plane的区别和用法

    Fill:表示绘制一块实心的铜皮,将区域中的所有连线和过孔连接在一块,而不考虑是否属于同一个网络.假如所绘制的区域中有VCC和GND两个网络,用Fill命令会把这两个网络的元素连接在一起,这样就有可能 ...

  4. Linux下静态编译Qt

    Qt采用编译的方式安装的时候,配置中默认的编译方式是动态编译的,但是有时候你编写的程序要发布出去,带很多动态库文件是很繁琐的,此时就需要静态编译你的程序,Qt要实现静态编译必须库文件也是静态编译的,所 ...

  5. http协议使用实例

    #include <stdio.h>#include <windows.h>#include <wininet.h> #define MAXSIZE 1024#pr ...

  6. Acdream1157---Segments (CDQ分治)

    陈丹琦分治~~~其实一些数据小的时候可以用二维或者多维树状数组做的,而数据大的时候就无力的题目,都可以用陈丹琦分治解决. 题目:由3钟类型操作:1)D L R(1 <= L <= R &l ...

  7. [LeetCode] Course Schedule I (207) & II (210) 解题思路

    207. Course Schedule There are a total of n courses you have to take, labeled from 0 to n - 1. Some ...

  8. B - Network - uva 315(求割点)

    题意:给一个无向连通图,求出割点的数量. 首先输入一个N(多实例,0结束),下面有不超过N行的数,每行的第一个数字代表后面的都和它存在边,0表示行输入的结束(很蛋疼的输入方式). 分析:割点的模板题 ...

  9. INTELLIJ IDEA集成CHECKSTYLE(转)

    转自:http://www.cnblogs.com/kiwi-wang/p/4166410.html 本文中使用intelliJ IDEA版本为14.0.1,其他版本差异不大,可同样安装. 下载安装C ...

  10. MySQL事务处理2

    MySQL5.X 都已经发布好久了,但是还有很多人认为MySQL是不支持事务处理的,这不得不怪他们是孤陋寡闻的,其实,只要你的MySQL版本支持BDB或 InnoDB表类型,那么你的MySQL就具有事 ...