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. HZOI20190822模拟29题解

    题面:https://www.cnblogs.com/Juve/articles/11396238.html 下面开始一句话题解: A:爬山: 二分答案,check即可 #include<ios ...

  2. vue.js_07_vue-resource的请求方式

    1.vue-resource 实现 get, post, jsonp请求 <body> <div id="app"> <input type=&quo ...

  3. China Final J - Mr.Panda and TubeMaster

    和一般的管道不同 不能类似“无限之环”或者“弯弯国”的建图,因为这两个题都是某些位置必须有,或者必须没有 但是本题可以有的位置随意,不能限制某个位置要么流2,要么流0,(实际上可能流了1过去) 所以建 ...

  4. android 数据绑定(1)Ativity、Fragment、Item绑定数据源

    1.简介 官方文档:  https://developer.android.com/topic/libraries/data-binding 官方示例: https://github.com/andr ...

  5. Django项目：CRM(客户关系管理系统)--35--27PerfectCRM实现King_admin编辑复选框

    #admin.py # ————————01PerfectCRM基本配置ADMIN———————— from django.contrib import admin # Register your m ...

  6. vue跨域，复杂请求，后端为beego

    关于跨域,网上讲得很多,具体实施起来大多讲的不详细,贴我的vue端代码 require('es6-promise').polyfill() import fetch from 'isomorphic- ...

  7. 解决springmvc 中文post请求乱码的过滤器配置

    在web.xml中添加如下配置 <!-- 过滤器 解决post乱码 --> <filter> <filter-name>characterEncodingFilte ...

  8. GIT生成公钥和私钥

    转载至:https://blog.csdn.net/gwz1196281550/article/details/80268200 打开 git bash! git config --global us ...

  9. MySQL--python关联MySQL、练习题

    1.python关联MySQL pymysql: 安装:pip3 install pymysql 1.0:连接到数据库中 import pymysql conn = pymysql.connect( ...

  10. vue+ElementUI项目中，input只能输入正整数的验证

    代码如下:     <el-input  v-model="famount" placeholder="请输入内容"   @keyup.native=&q ...