//得到手机屏幕的宽度

 let htmlWidth = document.documentElement.clientWidth || document.body.clientWidth;

 if(htmlWidth>750){htmlWidth=750}

 //得到html的Dom元素

 let htmlDom = document.getElementsByTagName('html')[0];

 //设置根元素字体大小

 htmlDom.style.fontSize = htmlWidth/20 + 'px';

 htmlDom.style.margin = '0 auto';

 htmlDom.style.maxWidth = 750 + 'px';

比如说，手机宽度像素为360px的话，1rem就是18px；像素为320px的话，1rem就是16px.

js控制手机端字体大小rem的更多相关文章

  1. js 抓取屏幕宽度设置字体大小 rem

    var doc = window.document var docEl = doc.documentElement var tid function refreshRem () { var width ...

  2. 手机端布局，rem布局动态获取根字体大小

    手机端布局,rem布局动态获取根字体大小. 以下代码: //rem布局动态获取根字体大小 function remDynamicLayout(){ var $windowWidth = $(windo ...

  3. 70.JS---利用原生js做手机端网页自适应解决方案rem布局

    利用原生js做手机端网页自适应解决方案rem布局 刚开始我用的是下面这段代码,然后js通过外部链接引入,最后每次用手机刷新网页的时候都会出现缩略图 function getRem(pwidth, pr ...

  4. js仿手机端九宫格登录功能

    js仿手机端九宫格登录功能 最近闲来无事把以前无聊时开发的小东西拿出来和大家分享下,写的不好的请指出,我会及时修改.谢谢. 功能及方法逻辑都注释在代码中.所以麻烦大家直接看代码. 效果如下: 话不多说 ...

  5. js判断手机端操作系统(Andorid/IOS)

    非常实用的js判断手机端操作系统(Andorid/IOS),并自动跳转相应下载界面 androidURL = "http://xxx/xxx.apk"; var browser = ...

  6. CSS3手机端字体不能小于12号的方法

    CSS3手机端字体不能小于12号的方法 <pre> .xiaoyu12fontsize{ -webkit-transform-origin: 0% 0%; -webkit-transfor ...

  7. CSS3字体大小rem属性用法

    PX为单位 在Web页面初期制作中,我们都是使用“px”来设置我们的文本,因为他比较精确和固定. 只要页面某元素设置了px字体大小,其子元素/子孙元素未设置字体大小或设置的字体大小css优先级没父元素 ...

  8. 应用js改变问章字体大小

    刚来公司的时候领导给分配的都是一些简单的简单的简单的.....任务 一次叫我把文章的字体大小变换功能写出来.在网上搜了很多都不管用!不过功夫不负有心人还是被我找到了!拿出来分享下! <scrip ...

  9. js判断手机端

    if (window.location.toString().indexOf('pref=padindex') != -1) { } else { if (/AppleWebKit.*Mobile/i ...

随机推荐

  1. 消除JQuery Mobile 列表样式右侧箭头

    有时候我们看到JQM上面有一些呈现跟我们要的很像如下面这个Listview效果   程序代码如下: view sourceprint? 1.<ul data-role="listvie ...

  2. Java 使用 Enum 实现单例模式

    在这篇文章中介绍了单例模式有五种写法:懒汉.饿汉.双重检验锁.静态内部类.枚举.如果涉及到反序列化创建对象时推荐使用枚举的方式来实现单例,因为Enum能防止反序列化时重新创建新的对象.本文介绍 Enu ...

  3. 调试技巧 ------ printf 的使用技巧

    编译器宏:__FUNCTION__,__FILE__,__LINE__ #define __debug #ifdef __debug //#define debug(format,...) print ...

  4. 一个简单的Kubernetes应用部署示例

    说明 我们通过一个示例来演示一下kubernetes部署应用的基本配置. 这个示例相对比较简单,就是一个tomcat应用加上一个mysql数据库 在tomcat里运行一个简单的webappp,这个ap ...

  5. 鸟哥的Linux私房菜——第十一章

    视频链接: 土豆:http://www.tudou.com/programs/view/yT0PfIWU720 B站(推荐): http://www.bilibili.com/video/av9877 ...

  6. 情人节网站logo赏析

    一年一度的情人节,不少网站都进行了不错的装点,我们不妨来简单浏览一下,借以触发灵感. 百度 百度的logo放上了改变,变成了一个gif,图片如下. 腾讯 淘宝 淘宝的logo同样换成了一个gif 谷歌 ...

  7. bzoj千题计划230：bzoj3205: [Apio2013]机器人

    http://www.lydsy.com/JudgeOnline/problem.php?id=3205 历时一天,老子终于把它A了 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈 因为不懂spfa ...

  8. Git与GitHub学习笔记（三）.gitignore文件忽略和删除本地以及远程文件

    一.Git提供了文件忽略功能.当对工作区某个目录或者某些文件设置了忽略后,git将不会对它们进行追踪 HELP:如何在IntelliJ IDEA中使用.ignore插件忽略不必要提交的文件 问题:最近 ...

  9. day63_SpringMVC学习笔记_01

    1.JAVAEE体系结构 JAVAEE体系结构图如下所示: 2.什么是springmvc? 什么是mvc? Model1 Model2 SpringMVC是什么? SpringMVC是一个web层mv ...

  10. 如何用javascript获取和设置css3属性

    ==================获取======================== 我想到的第一个思路 var test = document.getElementById('test'); c ...