let $html=document.documentElement,
windowW = window.innerWidth,
ratio = windowW / 750
if (windowW > 750) {
$html.style.fontSize='100px'
} else {
$html.style.fontSize=100 * ratio + "px"
} 常规的移动端ui出图都是以iphone6的尺寸来设计,上面设置好根字体后直接就可以拿设计稿上的尺寸用了。
比如:25px就写0.25rem即可,不同尺寸的移动设备就会自动匹配啦!

移动端rem使用的更多相关文章

  1. 谈谈我的移动端rem适配方案

    最近有点怀疑人生,毕竟一个人写前端,有时候会怀疑自己理解的一些东西包括用法有没有符合标准.趁着这阵子闲下来,翻了翻别人的rem适配博客,发现有点绕口,怪自己是个强迫症,啥都要自己去试试结果并从中理解, ...

  2. 关于移动端rem适配

    var num = 1 / window.devicePixelRatio; var fontSize = document.documentElement.clientWidth / 10; doc ...

  3. 第130天:移动端-rem布局

    一.关于布局方案 当拿到设计师给的UI设计图,前端的首要任务就是布局和样式,相信这对于大部分前端工程师来说已经不是什么难题了.移动端的布局相对PC较为简单,关键在于对不同设备的适配.之前介绍了一篇关于 ...

  4. 07. 如何实现移动端rem适配

    如何实现移动端rem适配 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

  5. 移动端REM布局模板(阿里高清方案)

    移动端REM布局模板(阿里高清方案),蛮好的,转自: http://www.jianshu.com/p/985d26b40199 . <!DOCTYPE html> <html la ...

  6. 移动端Rem布局注意事项

    1.布局的总体结构框架:      2.注意事项: (a):如果是左右两栏的布局方式,须在article的同级加一个aside: 因为是同级,所以必须设置同样的样式:而且他俩的父级,也就是sectio ...

  7. 移动端rem适应布局

    移动端rem适应布局 rem rem(root em)是一个相对单位,类似于em,em是父元素字体大小. 不同的是rem的基准是相对于html元素的字体大小. 比如,根元素(html)设置font-s ...

  8. 移动端rem适配&iOS兼容

    移动端rem适配js // 默认375,750设计稿请将375替换为750 (function (doc, win) { // 移动端适配 var docEl = doc.documentElemen ...

  9. H5 端 rem 适配方案与 viewport 适配

    H5 端 rem 适配方案与 viewport 适配 rem rem 是 CSS3 新增的一个相对单位(root em,根 em) 只根据当前页面 HTML 页面的 font-size 设置,如果根目 ...

  10. 移动端rem布局实践

      一.rem 适配基本概念: 对于移动端的开发,rem 适配必不可少,我们可以用多种方式实现, 根据 html 的 fontSize 属性值为基准,其它所有的 rem 值,根据这个基准计算.我们根据 ...

随机推荐

  1. JavaScript中正则表达式判断匹配规则以及常用的方法

    JavaScript中正则表达式判断匹配规则以及常用的方法: 字符串是编程时涉及到的最多的一种数据结构,对字符串进行操作的需求几乎无处不在. 正则表达式是一种用来匹配字符串的强有力的武器.它的设计思想 ...

  2. Koa框架教程,Koa框架开发指南,Koa框架中文使用手册,Koa框架中文文档

    我的博客:CODE大全:www.codedq.net:业余草:www.xttblog.com:爱分享:www.ndislwf.com或ifxvn.com. Koa -- 基于 Node.js 平台的下 ...

  3. JavaScript 开发总结(一)

    数据类型:JavaScript定义的数据类型有字符串.数字.布尔.数组.对象.Null.Undefined,但typeof有区分可判别的数据分类是number.string.boolean.objec ...

  4. 6.linux下部署 web 项目

    安装java 1.下载 linux 环境的jdk 2.上传该压缩包到 linux 系统中并且解压 tar -zxvf 压缩包名 3.配置环境变量并且刷新配置 export JAVA_HOME=/ali ...

  5. shell 字符串

    字符串可以分为单引号,双引号,也可以不用引号 单引号 str='this is string' 单引号字符的限制: 单引号中的任何字符都会原样输出,单引号中变量是无效的 单引号中不能出现单引号 双引号 ...

  6. 剑指OFFER——顺时针打印矩阵

    输入一个矩阵,按照从外向里以顺时针的顺序依次打印出每一个数字,例如,如果输入如下矩阵: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 则依次打印出数字1,2,3,4,8 ...

  7. python selenium无法最大化窗口

    问题原因:报错提示cannot get automation extension根据各种调试,发现是对应版本不对,上图发现selenium的版本是57.0.2987.133,需要driver为2.29 ...

  8. sphinx随笔记了一下

    sphinx笔记 一:下载中文版coreseek包1:解压后,将etc下的mysql.conf文件复制一份放到上级目录下,改名为sphinx.conf2:配置文件: 2.1:source配置数据源so ...

  9. Firefox插件推荐

    介绍一下我常用的几个Firefox插件,不一定适合所有人. 图中所示4个插件是我仅有的4个addons,除了stylish,其他几个已经伴随我多年. 1.Adblock Plus(强烈推荐) 广告拦截 ...

  10. hdu3416 Marriage Match IV(最短路+网络流)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=3416 题意: 给出含n个点.m条有向边的图,每条边只能走一次,给出起点和终点,求起点到终点的最短路径有 ...