这段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. Android 调用图库选择图片实现和参数详解

    //选择图片,调用图库        bt4.setOnClickListener(new OnClickListener() { @Override            public void o ...

  2. shellAPP

    1,linux操作日志记录,记录从各个ip登陆到系统的账号,指向命令及命令执行时间 #!/bin/bashecho "export PROMPT_COMMAND='{ msg=\$(hist ...

  3. 【KMP】剪花布条

    KMP算法 又水了一题.算是巩固复习吧. Problem Description 一块花布条,里面有些图案,另有一块直接可用的小饰条,里面也有一些图案.对于给定的花布条和小饰条,计算一下能从花布条中尽 ...

  4. javaweb笔记1之入门

    1 web应用的目录结构 web的根目录自定义 其中可以包括静态资源(html,image,css,js) |-WEB-INF(注意格式就是这样,大小写等等一模一样) |-class:存放的是字节码文 ...

  5. MVC框架个人浅析

    1.概述: 相信不少前端从业者,都会遇到MVC编程模式,现今多数轻量级网站用php作为后台交互,MVC编程模式用于JAVAWEB开发,应用类型以系统占多数(包括并不限于系统,电商网站,平台交互当然都能 ...

  6. 新唐Cortex-M0微控制器的省电管理

    新唐科技的NUC1xx包含NUC101.NUC100.NUC120.NUC130和NUC140,是以ARM Cortex-M0为核心的32位微控制器(MCU),经由不同时钟的设定,最高可以达到 50M ...

  7. CentOS7--64安装python的psutil模块

    1.以root身份登陆CentOS依次 执行以下命令: wget https://pypi.python.org/packages/source/p/psutil/psutil-2.1.3.tar.g ...

  8. XenServer 使用笔记

    XenServer 模拟千兆网卡 这两天用 XenServer 安装 VM,其中一台 VM 是用作无盘测试的 Linux Server,不在主流发行版之列,无奈 XenServer 日前对非主流的 L ...

  9. 使用匿名管道在进程间通信 (System.IO.Pipes使用)(转)

    原文地址:http://www.cnblogs.com/yukaizhao/archive/2011/08/04/system-io-pipes.html 管道的用途是在同一台机器上的进程之间通信,也 ...

  10. 安装XP和Ubuntu双系统问题——Ubuntu安装时无法识别原有系统

    我主机本来安装了windows xp 和unbuntu15.04,由于在ubuntu下不小心卸载某依赖后,无法登入桌面,网上查了好多资料,原因各种,解决途径也各种,最终是还没有解决问题.各种更新,各种 ...