1. window.onload = function(){
  2. /*720代表设计师给的设计稿的宽度,你的设计稿是多少,就写多少;100代表换算比例,这里写100是
  3. 为了以后好算,比如,你测量的一个宽度是100px,就可以写为1rem,以及1px=0.01rem等等*/
  4. getRem(720,100)
  5. };
  6. window.onresize = function(){
  7. getRem(720,100)
  8. };
  9. function getRem(pwidth,prem){
  10. var html = document.getElementsByTagName("html")[0];
  11. var oWidth = document.body.clientWidth || document.documentElement.clientWidth;
  12. html.style.fontSize = oWidth/pwidth*prem + "px";
  13. }

rem.js,移动多终端适配的更多相关文章

  1. rem.js的用法及在浏览器端的适配

    首先介绍下自己,我是从后端转前端,对于前端的见识还不深望各位全当一个新手自述....... 随着移动设配的更新换代,市场上涌现了大量的非主流设备分辨率,比如华为手机...... 更新换代快的大前提下自 ...

  2. 移动端适配rem为单位的rem.js及个别设备设置了大字体模式,导致页面变形的处理方式

    这段时间内,涉及到的都是移动端开发,说到移动端开发,我们就会思考到,目前分辨率的问题,如果用px为单位的话,在不同移动设备和不同分辨率下,页面的效果可能会有所不同,甚至导致页面变形.所以在次我们就用到 ...

  3. 移动端H5页面的最佳终端适配之Flexible

    lib-flexible是什么? lib-flexible是一个制作H5适配的开源库,可以点击这里下载相关文件,获取需要的JavaScript和CSS文件. 当然你可以直接使用阿里CDN: <s ...

  4. 使用Flexible实现手淘H5页面的终端适配【转】

    曾几何时为了兼容IE低版本浏览器而头痛,以为到Mobile时代可以跟这些麻烦说拜拜.可没想到到了移动时代,为了处理各终端的适配而乱了手脚.对于混迹各社区的偶,时常发现大家拿手机淘宝的H5页面做讨论—— ...

  5. 使用Flexible实现手淘H5页面的终端适配(转)

    曾几何时为了兼容IE低版本浏览器而头痛,以为到Mobile时代可以跟这些麻烦说拜拜.可没想到到了移动时代,为了处理各终端的适配而乱了手脚.对于混迹各社区的偶,时常发现大家拿手机淘宝的H5页面做讨论—— ...

  6. (转)使用Flexible实现手淘H5页面的终端适配

    原文链接 曾几何时为了兼容IE低版本浏览器而头痛,以为到Mobile时代可以跟这些麻烦说拜拜.可没想到到了移动时代,为了处理各终端的适配而乱了手脚.对于混迹各社区的偶,时常发现大家拿手机淘宝的H5页面 ...

  7. [转]使用Flexible实现手淘H5页面的终端适配

    曾几何时为了兼容IE低版本浏览器而头痛,以为到Mobile时代可以跟这些麻烦说拜拜.可没想到到了移动时代,为了处理各终端的适配而乱了手脚.对于混迹各社区的偶,时常发现大家拿手机淘宝的H5页面做讨论—— ...

  8. 移动端H5多终端适配解决方案

    推荐三篇文章: 1.来自手淘团队的开源技术flexibal.js github地址:https://github.com/isHelenaChan/flexible 2.来自“大漠”(就职于淘宝,也是 ...

  9. emoji表情多终端适配解决方案

    emoji表情多终端适配解决方案 emoji,也叫 颜表情 是日本在无线通信中所使用的视觉情感符号,由栗田穰崇(Shigetaka Kurita)创作,并在日本网络及手机用户中流行.自苹果公司发布的i ...

  10. JS判断设备终端(PC,iPad,iPhone,android,winPhone)和浏览器

    JS判断设备终端(PC,iPad,iPhone,android,winPhone)和浏览器 var ua = navigator.userAgent; var browser = {}, weixin ...

随机推荐

  1. Codeforces Round #747 (Div. 2)题解

    谢天谢地,还好没掉分,还加了8分,(8分再小也是加啊)前期刚开始有点卡,不过在尽力的调整状态之后,还是顺利的将前面的水题过完了,剩下的E2和F题就过不去了,估计是能力问题,自己还是得认真补题啦. E2 ...

  2. ansible模块及语法

    常用模块详解 模块说明及示例: 1.ping模块ping模块 主要用于判断远程客户端是否在线,用于ping本身服务器,返回值是changed.ping示例 ansible clu -m ping 2. ...

  3. 基于霸道秉火的STM32F103ZET6嵌入式开发之------基于定时TIM3的PWM实验

    1:PWM脉冲宽度调制 STM32 的定时器除了 TIM6 和 7.其他的定时器都可以用来产生 PWM 输出.其中高级定时器 TIM1 和 TIM8 可以同时产生多达 7 路的 PWM 输出.而通用定 ...

  4. Django 小实例S1 简易学生选课管理系统 6 实现登录逻辑

    Django 小实例S1 简易学生选课管理系统 第6节--实现登录逻辑 点击查看教程总目录 作者自我介绍:b站小UP主,时常直播编程+红警三,python1对1辅导老师. 1 业务逻辑 本教程第四节里 ...

  5. Unable to unwrap data, invalid status [CLOSED]-服务端webSocket报错

    一.问题由来 现在的项目中在使用webSocket这门技术,主要用来在服务端和客户端进行实时的数据传输,因为需要及时的进行响应,所以才没有使用http请求的方式, 而是使用socket的方式,这样可以 ...

  6. [hdu7044]Fall with Fake Problem

    二分$T$​​​​​​​​和$S$​​​​​​​​第一个不同的位置,即需要对于$s$​​​​​​​​,判定是否存在$T[1,s]=S[1,s]$​​​​​​​​且满足条件的$T$​​​​ (注:这里的 ...

  7. [cf1486F]Pairs of Paths

    以1为根建树,先将所有路径挂在lca上,再分两类讨论: 1.lca相同,此时我们仅关心于lca上不经过第$a$和$b$个儿子路径数,容斥一下,即所有路径-经过$a$的-经过$b$的+经过$a$和$b$ ...

  8. 如何在C#中使用Google.Protobuf工具

    protobuf是一个语言无关.平台无关的序列化协议,由谷歌开源提供.再加上其高性能.存储占用更小等特点,在云原生的应用中越来越广泛. 在C#中主要有两种方法来使用protobuf协议,nuget包分 ...

  9. linux的ip文件参数说明

    TYPE=Ethernet # 网卡类型:为以太网 PROXY_METHOD=none # 代理方式:关闭状态 BROWSER_ONLY=no # 只是浏览器:否 BOOTPROTO=dhcp # 网 ...

  10. html图片动态增加文字

    <body> <!-- <div class="logo"> <img src="${imagePath}/disc.PNG" ...