bootstrap默认 html｛font-size: 10px;}

rem是一个相对大小的值，它相对于根元素<html>，

假设，我们设置html的字体大小的值为html｛font-size: 87.5%;｝（也就是14px）。

然后其他的字体就是将你要的值除以14得到的值；

比如padding的24px也就是24/14=1.714285714285714rem，以此类推。

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

另外rem在ie8及ie8以下的版本不支持外其他浏览器都支持，如果要考虑ie8及以下，设置个px再设置个rem就可以了。

px和rem换算的更多相关文章

  1. CSS3中的Rem值与Px之间的换算

    bootstrap默认 html{font-size: 10px;} rem是一个相对大小的值,它相对于根元素<html>, 比如假设,我们设置html的字体大小的值为html{font- ...

  2. CSS3 中的 rem 值与 px 之间的换算

    想给博客换个主题,到处找找不到满意的,最后发现默认主题 twentytwelve 越看越顺眼,于是就想动手改一下用. 看 CSS 文件的时候发现引入了一个新大小单位:rem,虽然 CSS 文件注释里有 ...

  3. rem与px之间的换算（移动端）

    最近因为工作接触到rem与px之间的换算,之前知道一些,不过还是比较笼统模糊,用起来不是很明白,后来自己查了点资料,以及亲自测试总算明白它们之间是怎么换算的了. rem是一个相对值,它相对于根元素ht ...

  4. Sublime Text中安装插件来实现px与rem间的换算

    今天在群里无意中看到了群友分享的一篇关于移动端的文章.里面其他内容我倒不大感兴趣,反而是rem让我提起了兴趣. 首先来谈一下rem,rem是CSS3中新增加的一个单位值,它和em单位一样,都是一个相对 ...

  5. px与rem关系及转换

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

  6. css大小单位px em rem的转换和详解

    css大小单位px em rem的转换和详解 PX特点1. IE无法调整那些使用px作为单位的字体大小:2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位:3. Firefox能 ...

  7. px,em,rem的区别

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

  8. 前端页面适配的rem换算

    为什么要使用rem 之前有些适配做法,是通过js动态计算viewport的缩放值(initial-scale). 例如以屏幕320像素为基准,设置1,那屏幕375像素就是375/320=1.18以此类 ...

  9. 前端页面的适配使用rem换算

    前端页面的适配使用rem换算 https://www.cnblogs.com/liangxuru/p/6970629.html 注:本文转载之处:https://www.cnblogs.com/ann ...

随机推荐

  1. 判断django中的orm为空

    result= Booking.objects.filter() #方法一 .exists() if result.exists(): print "QuerySet has Data&qu ...

  2. SPSS分析技术：CMH检验（分层卡方检验）；辛普森悖论，数据分析的谬误

    SPSS分析技术:CMH检验(分层卡方检验):辛普森悖论,数据分析的谬误 只涉及两个分类变量的卡方检验有些时候是很局限的,因为混杂因素总是存在,如果不考虑混杂因素,得出的分析结论很可能是谬误的,这就是 ...

  3. compareTo)--list 根据某字段排序

    Collections.sort(actList, new Comparator<Act>() { @Override public int compare(Act o1, Act o2) ...

  4. 洛谷P2827 蚯蚓

    传送门 pts85/90(90应该是个意外,第一次交是90之后都是85了): 优先队列模拟题意 #include<iostream> #include<cstdio> #inc ...

  5. JasperReport报表参数9

    填充一个报表的主要输入是:报表模板,参数和数据源.本章将介绍这些参数,并在接下来的章节中,我们将介绍数据源. 参数是在报表填充操作传递给报表引擎的对象引用.参数传递有用的数据到报表引擎,它可以不通过数 ...

  6. 【转载】Linux Examination

    原博地址:https://blog.csdn.net/weixin_42568655/article/details/94603660 (来自我的同学QiaoGuangtong大佬) Fundamen ...

  7. mac下更改MySQL的默认编码

    mysql默认的编码是latin1,它不支持中文,所以我们一般需要修改他的默认编码格式. 打开终端1. 进入root权限sudo -i 2. cp /usr/local/mysql/support-f ...

  8. CF 549B Looksery Party

    题面 解题思路 如果a数组全部>0,那么都不去即可.从这个角度出发,每次选出a[i]为0的,让它们去更新a数组,相当于拓补排序. 代码 #include<iostream> #inc ...

  9. Eclipse 遇到的问题和快捷键记录

    一.the user operation is waiting: 选择菜单栏的"Project",然后把菜单栏中"Build Automatically"前面的 ...

  10. 【JZOJ5233】【GDOI模拟8.5】概率博弈 树形dp+期望

    题面 小A和小B在玩游戏.这个游戏是这样的: 有一棵n个点的以1为根的有根树,叶子有权值.假设有m个叶子,那么树上每个叶子的权值序列就是一个1->m 的排列. 一开始在1号点有一颗棋子.两人轮流 ...