//得到手机屏幕的宽度

 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. SSO系统的实现

    当一个网站系统比较大型的时候,我们通常采用面向服务的编程,采用分布式的编程.各个子系统共同来实现一个大的系统,这时候登录注册功能的实现也面临着一些问题. 一.WHAT? SSO是什么? sso是单点登 ...

  2. .net MVC框架里怎么写控件

    .net的MVC框架如果选择了Razor引擎就需要自己来写控件了,这里列出了一些简单的控件的书写方法 @*这是TextBox控件的写法*@ @Html.TextBox("textbox1&q ...

  3. IOS的属性和实例变量

    实际上,@property声明的是属性,并不是实例变量.但是编译器会根据属性,自动生成实例变量,和对应的access方法.所以已经在interface里声明了@property,就不再需要在imple ...

  4. python---django中模板渲染（csrf令牌使用，自定义模板函数）

    使用终端,可以更方便的去实验,但是没有提示信息: 在项目目录下: D:\MyPython\day23\HelloWorld>python manage.py shell 开始实验: >&g ...

  5. vs2015的visual assist X options安装过程

    1.安装VA_X之前,请先关闭VS2015程序. 2.下载VA_X_Setup2048.exe和VAX2048破解补丁.zip. 3.双击运行VA_X_Setup2048.exe文件,安装完成后出现 ...

  6. Spark记录-Spark on mesos配置

    1.安装mesos #用centos6的源yum安装 # rpm -Uvh http://repos.mesosphere.io/el/6/noarch/RPMS/mesosphere-el-repo ...

  7. POJ - 1753 Flip Game（状压枚举）

    https://vjudge.net/problem/POJ-1753 题意 4*4的棋盘,翻转其中的一个棋子,会带动邻接的棋子一起动.现要求把所有棋子都翻成同一种颜色,问最少需要几步. 分析 同一个 ...

  8. ngx_lua_API 指令详解（二）ngx.re.match/find/gmatch/sub/gsub指令集合

    1.先来个官方的ngx.re.match location /ngx_re_match { default_type text/html; content_by_lua_block { local m ...

  9. MySql数据库资料收集

    1.下载MySQL历史版本 https://downloads.mysql.com/archives/community/ https://downloads.mysql.com/archives/i ...

  10. 第11月第31天 keyboardwillshow CGAffineTransformMakeTranslation

    1. - (void)dealloc { [[NSNotificationCenter defaultCenter] removeObserver:self]; } - (void)registerN ...