手机端开发,一般以320px宽为最低标题。市场上的手机,大多数是360px宽。

20px=1rem是最容易换算的,基本上可以口算,除以2并缩小十倍。1px/20=0.05rem。两位小数就可以除尽了。

结合媒体查询就是:

@media only screen and (min-width: 320px){
html {
font-size : 20px !important;
}
}

当然了,你也可以选择js动态计算:

    var width = window.screen.width;
document.getElementsByTagName("html")[0].style.fontSize = (width*0.0625) + "px";

rem介绍的更多相关文章

  1. 移动端页面使用rem来做适配

    文/九彩拼盘(简书作者)原文链接:http://www.jianshu.com/p/eb05c775d3c6著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”. rem介绍 rem(font ...

  2. css之rem布局

    rem介绍和原理网上都是,这里不具体介绍 以iphone6设计稿 let htmlWidth = document.documentElement.clientWidth || document.bo ...

  3. CSS3移动端vw+rem不依赖JS实现响应式布局

    1.前言 (1)vw/vh介绍 在使用之前,我们先简单了解一下什么是vw和rem以及它们的作用,vw是css3出现的一个新单位,它是"view width"缩写,定义为把当前屏幕分 ...

  4. 移动 web 端屏幕适配 - rem

    前言 最近整理了一下以前学习前端的笔记,发现自己对移动 web 端屏幕适配(rem)这一块并没有真正理解,只是会用.接下来,把自己的一些对移动 web 端屏幕适配(rem)的思考记录下来. rem 介 ...

  5. CSS3中的rem单位

    一.rem介绍 rem是什么? 它的全称是 font size of the root element (根元素的字体大小) 它是CSS3中新增加的一个尺寸(度量)单位,根节点(html)的font- ...

  6. px、em、rem区别介绍

    px.em.rem区别介绍 PX px像素(Pixel).相对长度单位.像素px是相对于显示器屏幕分辨率而言的. PX特点 1. IE无法调整那些使用px作为单位的字体大小: 2. 国外的大部分网站能 ...

  7. 简单介绍移动端CSS3单位rem的用法

    PC端大部份是用px单位,小部分用em单位,而移动端,请全部用rem单位吧.目前大部份设备,包括但不限于iOS 5+.Android 2.3+.Window Phone 8+都是可以兼容的,具体兼容表 ...

  8. css单位介绍em ex ch rem vw vh vm cm mm in pt pc px

    长度单位主要有以下几种em ex ch rem vw vh vm cm mm in pt pc px %,大概可以分为几种"绝对单位"和"相对单位"和" ...

  9. CSS3- px、em、rem区别介绍

    PX px像素(Pixel).相对长度单位.像素px是相对于显示器屏幕分辨率而言的. PX特点 1. IE无法调整那些使用px作为单位的字体大小: 2. 国外的大部分网站能够调整的原因在于其使用了em ...

随机推荐

  1. HTML。CSS浮动元素详解

    浮动定位是指 1.1将元素排除在普通流之外,即元素将脱离标准文档流 1.2元素将不在页面占用空间 1.3将浮动元素放置在包含框的左边或者右边 1.4浮动元素依旧位于包含框之内 2. 浮动的框可以向左或 ...

  2. asp.net MVC上传图片完整方法

    图片上传 自动创建文件夹并重命名(带缩略图) 后台: [HttpPost] public ActionResult WanSell_UploadPicture(ProductGalleryModels ...

  3. IE8下服务端获取客户端文件的路径为C:/fakePath问题的解决方案

    上一篇文章上提到,IE8下服务端获取客户端文件的路径时,会变成C:/fakePath问题,于是乎通过文件路径去获得文件大小就失败了. 上网搜了一下,主要原因是IE8因为安全考虑,在上传文件时屏蔽了真实 ...

  4. sql 递归子查询

    select (SELECT (Case A1.AreaAbbr WHEN '' THEN A1.AreaName Else A1.AreaAbbr  END)+ ' ' FROM AreaLang ...

  5. jdk1.7和jdk1.8的String的getByte方法的差异

    最近遇到一个奇葩的bug,jdk1.7下正常的程序到了jdk1.8下就不能用了,经过查找原因发现是因为jdk版本升级导致的获取的getbyte时得到的byte数组不同造成的.

  6. 10.openssl x509

    主要用于输出证书信息.也能够用于签名.自签名.转换证书格式.还原证书为证书请求等.该命令非常强大,几乎实现了伪命令req,ca,verify,crl的所有功能,最牛的一点是该命令不需要通过配置文件就能 ...

  7. s​v​n​的​基​线​划​分​与​管​理

    一.基线(服务端默认划分3条基线) trunk:表示开发时版本存放的目录,即在开发阶段的代码都提交到该目录上. branches:表示发布的版本存放的目录,即项目上线时发布的稳定版本存放在该目录中. ...

  8. MSIL Emit AOP

    参考链接: https://pieterderycke.wordpress.com/tag/reflection-emit/ http://www.moon-soft.com/doc/23252.ht ...

  9. mssql2000 身份证号码验证

    CREATE VIEW thisDate --返回当前日期,因为自定义函数中不能使用GETDATE() AS ),) AS aDate )) /*mssql2000 返回值=0,身份证校验正确 1:位 ...

  10. 源码编译Nodejs 4.6 on CentOS6

    1.本来是要按照个newman程序,无奈newman必须要node版本>=4,所以不得不安装node4.6 下载地址:https://nodejs.org/dist/v4.6.0/node-v4 ...