CSS3中的Rem值与Px之间的换算
bootstrap默认 html{font-size: 10px;}
rem是一个相对大小的值,它相对于根元素<html>,
比如假设,我们设置html的字体大小的值为html{font-size: 87.5%;}
(也就是14px)。
然后其他的字体就是将你要的值除以14得到的值;
比如默认的twentytwelve主题大小是960px;换算成rem就是960/14=68.57142857142857rem;
padding的24px也就是24/14=1.714285714285714rem,以此类推。
上面的14是个变量,相对于你对根元素html字体大小的设定,如果你设定的是62.5%,那除数就变成10了,对照表如右图:
用这个rem单位的好处有啥我不知道,不过如果你根元素的字体大小选62.5%,那px和rem之间的换算就是px直接除以10就得到rem了,这比em简单多了,到现在我都没搞清楚em和px之间是如何换算的。
另外rem在ie8及ie8以下的版本不支持外其他浏览器都支持,如果你要考虑ie8及一下,可以像twentytwelve默认文件那样设置个px再设置个rem就可以了。
参考:http://lms.im/html-css/1069.html
CSS3中的Rem值与Px之间的换算的更多相关文章
- CSS3 中的 rem 值与 px 之间的换算
想给博客换个主题,到处找找不到满意的,最后发现默认主题 twentytwelve 越看越顺眼,于是就想动手改一下用. 看 CSS 文件的时候发现引入了一个新大小单位:rem,虽然 CSS 文件注释里有 ...
- rem与px之间的换算(移动端)
最近因为工作接触到rem与px之间的换算,之前知道一些,不过还是比较笼统模糊,用起来不是很明白,后来自己查了点资料,以及亲自测试总算明白它们之间是怎么换算的了. rem是一个相对值,它相对于根元素ht ...
- CSS3中的rem单位
一.rem介绍 rem是什么? 它的全称是 font size of the root element (根元素的字体大小) 它是CSS3中新增加的一个尺寸(度量)单位,根节点(html)的font- ...
- css3中单位rem与.less结合布局
rem是CSS3新增的一个相对单位(root em,根em),这个单位引起了广泛关注.这个单位与em有什么区别呢?区别在于使用rem为元素设定字体大小时,仍然是相对大小,但相对的只是HTML根元素. ...
- em与px之间的换算
任意浏览器的默认字体高度16px(16像素).所有未经调整的浏览器都符合:1em=16px.那么12px=0.75em,10px=0.625em.为了简化font-size的换算,需要在css中的bo ...
- em,pt和px之间的换算
任意浏览器的默认字体高度16px(16像素).所有未经调整的浏览器都符合: 1em=16px.那么12px=0.75em,10px=0.625em.为了简化font-size的换算,需要在css中的b ...
- 如何把设计稿中px值转化为想要的rem值
首先我们需要的是把尺寸转化为rem值 假如 设计稿中的是 200px*200px的图片 移动端的设计图尺寸一般是640*750; 第一步. 把图片分为若干份(好算即可),每一份的大小就是rem的单位 ...
- rem、em、px之间的转换
rem是相对于根元素<html>,这样就意味着,我们只需要在根元素确定一个参考值,这个参考值设置为多少,完全可以根据您自己的需求来定. 我们知道,浏览器默认的字号16px,来看一些px单位 ...
- css3中rem和em是干嘛的
css3中rem和em是干嘛的 一.总结 一句话总结:对rem综合评价是用来做web app它绝对是最合适的人选之一. 这里我特别强调web app,web page就不能使用rem吗,其实也当然可以 ...
随机推荐
- 【读书笔记】iOS网络-优化请求性能
一,度量网络性能 1,网络带宽 用于描述无线网络性能的最常见度量指标就是带宽.在数字无线通信中,网络带宽可以描述为两个端点之间的通信通道每秒钟可以传输的位数.现代无线网络所能提供的理论带宽是很高的.不 ...
- 9、数据库工程师要阅读的书籍 - IT软件人员书籍系列文章
数据库设计是软件项目底层的工作,它关系到软件项目的基础内容设计问题.数据库工程师的工作,就是设计数据库,维护数据库,优化数据库,这个跟DBA数据库助手的工作类似.现在的数据库有好几种了,比如MS SQ ...
- 《Hey程序员 你适合加入创业公司吗?》再补充
笔者经过多年的走访发现,不是所有优秀的程序员都能在创业公司如鱼得水.根据笔者的经验,具备下面几点优秀品质的程序员会更容易适应创业公司的环境. 1.娴熟的调试技巧可以说,程序员的大部分时间都花在调试程序 ...
- 从拟物化到扁平,再到Material Design
Google I/O 2014提出Material Design,这段时间听到不少关于Material Design的解读,至此Google已经定位了自己的设计语言,我个人看来就是Android和iO ...
- Symantec Backup Exec 报"Access denied to directory xxx" Error Code E0008488
使用Symantec Backup Exec将几台Linux服务器上的RMAN备份收带时,偶尔会遇到作业备份失败的情况,检查Job History,就会发现有“Access denied to dir ...
- Mongodb Manual阅读笔记:CH5 安全性
5 安全性 Mongodb Manual阅读笔记:CH2 Mongodb CRUD 操作Mongodb Manual阅读笔记:CH3 数据模型(Data Models)Mongodb Manual阅读 ...
- 关于GUID的相关知识
全局唯一标识符(GUID,Globally Unique Identifier)是一种由算法生成的二进制长度为128位的数字标识符.GUID主要用于在拥有多个节点.多台计算机的网络或系统中.在理想情 ...
- 我的ElasticSearch集群部署总结--大数据搜索引擎你不得不知
摘要:世上有三类书籍:1.介绍知识,2.阐述理论,3.工具书:世间也存在两类知识:1.技术,2.思想.以下是我在部署ElasticSearch集群时的经验总结,它们大体属于第一类知识“techknow ...
- db2存储过程
一. 使用存储过程的好处 1. 减少客户机与服务器之间的网络使用率,以及数据库锁定保持的时间 应用程序通常在执行每个SQL语句都要跨网络两次,存储过程可以将SQL语句集中在一起, 从而使得对于每一组S ...
- 烂泥:mysql5.5主从同步复制配置
本文由秀依林枫提供友情赞助,首发于烂泥行天下. 在上篇文章<烂泥:学习mysql数据库主从同步复制原理>中,我们介绍了有关mysql主从复制的基本原理.在这篇文章中,我们来实际测试下mys ...