我们最常用的字体单位是PX和EM。

首先px：

px像素（Pixel）。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。(引自CSS2.0手册)

px会随着屏幕分辨率的改变而改变，但是浏览器对页面进行缩放时会对页面的整体布局产生影响。

em：

em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。(引自CSS2.0手册)

em一般会以<body>的font-size为基准，他继承于父级元素。如果多层嵌套比较容易引起混乱。例如:

<body>

　　<div>

　　　　<p></p>

　　</div>

</body>

如果body中设置字体为10px，div中字体为1.2em即12px。那么如果要设置p中字体为12px，则应在p中设置1em而非1.2em。若在p中设置1.2em，则字体实际大小为1.2*1.2=1.44。

而css3出现了一个新的单位rem

使用rem为元素设定字体大小时，仍然是相对大小，但相对的只是HTML根元素，而非em相对的父级元素。

也就是说你可以在html节点定义一个单独的字体大小，然后所有其他元素使用rem相对于这个字体的百分比进行设置，这样就意味着，我们只需要在根元素确定一个参考值，在根元

素中设置多大的字体，这完全可以根据您自己的需要。

比如：

html{font-size:62.5%}/*根元素中定义了一个基本字体大小为62.5%（也就是10px。设置这个值主要方便计算，如果没有设置，将是以“16px”为基准 ）。

body{font-size:1.2rem}/*12px*/

h1{font-size:1.4rem}/*14px*/

具体换算参考http://pxtoem.com/

看了些关于rem的知识点，在这做个自我总结归纳的更多相关文章

  1. IOS学习笔记48--一些常见的IOS知识点+面试题

      IOS学习笔记48--一些常见的IOS知识点+面试题   1.堆和栈什么区别? 答:管理方式:对于栈来讲,是由编译器自动管理,无需我们手工控制:对于堆来说,释放工作由程序员控制,容易产生memor ...

  2. javascript 容易忽略的小知识点 new到底做了什么？

    问题:平时我们经常写 var ss = new Person():ss就是一个由'Person类'生成的对象了,可是我们的Person方法里却没有写 return: (var ss= Person() ...

  3. LeetCode 87，远看是字符串其实是搜索，你能做出来吗？

    本文始发于个人公众号:TechFlow,原创不易,求个关注 今天是LeetCode专题第54篇文章,我们一起来看LeetCode 87题,Scramble String(爬行字符串). 这题的官方难度 ...

  4. 一文看懂：ChIP实验和qPCR定量分析怎么做｜易基因技术

    大家好,这里是专注表观组学十余年,领跑多组学科研服务的易基因. 染色质免疫共沉淀(Chromatin Immunoprecipitation,ChIP),是研究体内蛋白质与DNA相互作用的经典方法. ...

  5. Android 的 so 文件加载机制

    本篇文章已授权微信公众号 guolin_blog (郭霖)独家发布 最近碰到一些 so 文件问题,顺便将相关知识点梳理一下. 提问 本文的结论是跟着 System.loadlibrary() 一层层源 ...

  6. 插件化框架解读之so 文件加载机制（四）

    阿里P7移动互联网架构师进阶视频(每日更新中)免费学习请点击:https://space.bilibili.com/474380680 提问 本文的结论是跟着 System.loadlibrary() ...

  7. MemSQL分布式架构介绍(一)

    最近在了解MemSQL架构,看了些官方文档,在这里做个记录,原文在这里:http://docs.memsql.com/latest/concepts/distributed_architecture/ ...

  8. JAVA开发：分享一些SpringMvc+Ibatis+spring的框架使用心得

    近期不在做.net的项目,而是使用java作为开发语言,就想着要用springmvc开发了,由于前些年也用过struts1/2+hibernate/ibatis+spring开发过项目,因此是有些底子 ...

  9. DB2开发系列之一——基本语法

    最近看了些db2开发方面的资料,现做摘要,以供自己和大家参考: 1.变量声明 DECLARE v_salary DEC(9,2) DEFAULT 0.0; DECLARE v_status char( ...

随机推荐

  1. 如何在Ubuntu 13.04中升级到 GNOME 3.8

    如何在Ubuntu 13.04中升级到 GNOME 3.8 添加 GNOME 3 PPA(Personal Package Archives) 在你进一步浏览之前,确认你正在运行的是Ubuntu 13 ...

  2. MHA手动在线切换主 原创3（主不参与复制)

    monitor 执行:slave2连接到slave1,server1 不做(主/从复制角色,停在那里) [root@monitor app1]# masterha_master_switch --co ...

  3. 如何在Android应用程序中使用传感器(OpenIntents开源组织SensorSimulator项目)

    原文地址http://blog.sina.com.cn/s/blog_621c16b101013ygl.html OpenIntents项目和可用资源介绍 [1].    项目介绍:OpenInten ...

  4. Python拼接多张图片

    写机器学习相关博文,经常会碰到很多公式,而Latex正式编辑公式的利器.目前国内常用的博客系统,好像只有博客园支持,所以当初选择落户博客园.我现在基本都是用Latex写博文,然后要发表到博客园上与大家 ...

  5. PHP对大文件的处理思路

    需求: 现有一个1G左右的日志文件,大约有500多万行, 用php返回最后几行的内容. 在php中,对于文件的读取时,最快捷的方式莫过于使用一些诸如file.file_get_contents之类的函 ...

  6. 最新cocoapods安装流程，安装过程中遇到的问题及解决方法

    最近重新安装了一次cocoapods,参考的安装流程:http://blog.csdn.net/showhilllee/article/details/38398119/ 但是现在的cocoapods ...

  7. 电商平台如何接入快递鸟电子面单API?

    快递鸟是全球物流接口服务商,为电商 ERP.电商平台.仓储.清关公司提供物流跟踪.电子面单.智选物流.物流金融.在线下单等服务,解决电商的物流管理模块和金融模块.现就对快递鸟电子面单API做基本描述, ...

  8. [改善Java代码] 提倡异常的封装

    JavaAPI提供的异常都是比较低级别的,低级别是指只有开发人员才能看懂的异常.而对于终端用户来说基本上就是天书,与业务无关,是纯计算机语言的描述. 异常封装的三方面的好处: 1)提高系统的友好性   ...

  9. poj 2983 差分约束

    思路: 设dis[i]为标号为i的点到0号点的距离.对于P A B X,我们能得到等式dis[a]-dis[b]=x,那么可以化为两个不等式dis[a]-dis[b]>=x和dis[b]-dis ...

  10. CSS实现标题超出宽度省略号来表示

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...