rem好像也是一个相对大小的值,它是相对于根元素<html>,比如假设,我们设置html的字体大小的值为 html{font-size: 87.5%;}(也就是14px,这是twentytwelve默认主题里的设置)。然后其他的字体就是将你要的值除以14得到的值;比如默认的twentytwelve主题大小是960px;换算成rem就是960/14=68.57142857142857rem(我这个用电脑的计算器计算的,比默认的更精确,嘿嘿);padding的24px也就是24/14=1.714285714285714rem(当然还是比css文件里的精确),以此类推。

上面的14是个变量,相对于你对根元素html字体大小的设定,如果你设定的是62.5%,那除数就变成10了,对照表如图:

上面的14是个变量,相对于你对根元素html字体大小的设定,如果你设定的是62.5%,那除数就变成10了,对照表如右图:

用这个rem单位的好处有啥我不知道,不过如果你根元素的字体大小选62.5%,那px和rem之间的换算就是px直接除以10就得到rem了,这比em简单多了,到现在我都没搞清楚em和px之间是如何换算的。

另外rem在ie8及ie8以下的版本不支持外其他浏览器都支持,如果你要考虑ie8及一下,可以像twentytwelve默认文件那样设置个px再设置个rem就可以了。

CSS中的rem的换算的更多相关文章

  1. CSS中的 REM PX EM

    px像素(Pixel).相对长度单位.像素px是相对于显示器屏幕分辨率而言的 em是相对长度单位.相对于当前对象内文本的字体尺寸.如当前对行内文本的字体尺寸未被人为设置,则相对于浏览器的默认字体尺寸. ...

  2. CSS中em,rem的区别

    首先这两个单位一般用在移动端 不太清楚得求证  再记录 1.em w3cschool中给出css中尺寸单位如下: 单位 描述 % 百分比 in 英寸 cm 厘米 mm 毫米 em 1em 等于当前的字 ...

  3. CSS 中的rem,em,vh,vw一次说清楚

    关于css中的长度单位,我们用的最多就是px,因为他简单直接.但是当一套方案匹配不同终端时,px就会显得过于生硬,不容易变通. 然而rem,em,vh,vw就可以有效的解决这一问题.让我们来看看这些东 ...

  4. CSS中的rem

    为什么会使用rem呢?主要还是浏览器和设备的大小不一. 这样就涉及到页面布局的不统一啦,先说说pc中的多栏布局吧,多栏布局有三种基本的实现方式:固定宽度.流动.弹性,下面我们就分别说说这三种布局吧. ...

  5. CSS中px,em,rem,pt的区别及四者换算?

    本文章重要说明px,em,rem,pt的区别以及四者之间的换算. em单位有如下特点 1. em的值并不是固定的; 2. em会继承父级元素的字体大小. 我们在写CSS的时候如果要用em为单位,需要注 ...

  6. css中单位px、pt、em和rem的区别

    国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什么优劣呢? px :像素(Pixel).相对长度单位.像素px是相对于显示器屏幕分辨率而言的.(引自CSS ...

  7. 彻底弄懂css中单位px和em,rem的区别

    国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什么优劣呢? PX特点 -1. IE无法调整那些使用px作为单位的字体大小: -2. 国外的大部分网站能够调 ...

  8. CSS中单位px和em,rem的区别

    PX特点: 1 IE无法调整那些使用px作为单位的字体大小: 2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位: 3. Firefox能够调整px和em,rem,但是96%以上 ...

  9. css中的px、em、rem 详解

    概念介绍: 1.px (pixel,像素):是一个虚拟长度单位,是计算机系统的数字化图像长度单位,如果px要换算成物理长度,需要指定精度DPI(Dots Per Inch,每英寸像素数),在扫描打印时 ...

随机推荐

  1. beaglebone black 固定IP上网(ubuntu16.04,console)

    今天把beaglebone black搞了下,让能通过网线上网.需要修改一些文件.刷的是ubuntu16.04系统,没有界面.不过资源占用很少,顺便说一下.系统下的vi不好用,没有安装vim. 下面的 ...

  2. C++网络套接字编程TCP和UDP实例

    原文地址:C++网络套接字编程TCP和UDP实例作者:xiaojiangjiang 1.       创建一个简单的SOCKET编程流程如下 面向有连接的套接字编程 服务器: 1)  创建套接字(so ...

  3. NetBean 8 创建EJB

    一. 介绍 百度了一下关于在NetBean开发环境里创建EJB的教程,没有找到好的例子,2天的调试过程,写下来帮助后人. EJB (Enterprise Java Bean) 是一套高扩展性的开发企业 ...

  4. 11.11光棍节工作心得——github/MVP

    11.11光棍节工作心得 1.根据scrum meeting thirdday中前辈的指导进行学习 我在博客中贴了链接,竟然TrackBack引来了原博主,

  5. iOS中RSA加密详解

    先贴出代码的地址,做个说明,因为RSA加密在iOS的代码比较少,网上开源的也很少,最多的才8个星星.使用过程中发现有错误.然后我做了修正,和另一个库进行了整合,然后将其支持CocoaPod. http ...

  6. 转VS2010解决方案转换到VS2008

      原文链接地址:http://www.codeproject.com/Tips/80953/Converting-VS2010-Solution-to-VS2008 如果你使用VS2010的任何版本 ...

  7. pycharm svn服务器访问不了的问题。

    昨天使用pycharm访问svn服务器的时候一直登陆不上. 总结一下遇到的svn的问题. 1.用户名密码错误.简单致命, 2.svn访问权限,这个是svn服务器那边可以设置的. 3.svn路径拼写错误 ...

  8. KMP模板

    参考:http://www.cnblogs.com/c-cloud/p/3224788.html #include<stdio.h> #include<string.h> vo ...

  9. 反编译apk

    一.反编译Apk得到Java源代码 首先要下载两个工具:dex2jar和JD-GUI 前者是将apk中的classes.dex转化成Jar文件,而JD-GUI是一个反编译工具,可以直接查看Jar包的源 ...

  10. json格式化工具

    1.JsonViewer 可对json数据进行查看.格式化.编辑...... 2.在线工具 http://json.parser.online.fr/