本节书摘来自华章社区《响应式Web设计：HTML5和CSS3实践指南》一书中的第2章，第2.2节创建自适应的响应式字体，作者（美）　Benjamin LaGrone，更多章节内容可以访问云栖社区“华章社区”公众号查看

2.2　创建自适应的响应式字体
该技巧是一个简单的响应式字体示例。它将演示如何使用新的尺寸单元REM。REM的意思是根EM（Root EM）。如果使用EM单元，意味着字体尺寸与根元素字体尺寸有关，而不是父元素字体。

2.2.1　准备工作
在进一步讨论之前，我们先看看这个技巧。先通过我最爱的Ipsum生成器(http://ipsum.com)生成一些用于填充的文本内容。至少生成一个段落文本并复制到剪贴板中。

2.2.2　实现方式
现在，将填充文本粘贴到HTML文档中并包装在一个段落标签中。设置该段落元素的类为a，然后再复制一份并将新段落元素的类改为b。如下面的代码片段所示：

现在，将浏览器窗口从横向模式调整到纵向模式时，会看到第一个段落的字体大小与基本字体大小的比例从1:1变为了3:1。这虽然看起来非常简单，但是该方法可以多样化，基于此方法可以实现很多令人印象深刻的响应式字体效果。

2.2.3　工作原理
当浏览器发送请求时，CSS3的@media查询会基于视窗宽度返回不同的样式。随着视窗大小的改变会实时地加载或建立（重建）样式。虽然不会有太多的用户在浏览网站过程中频繁改变视窗大小，但是如何使得网站更好地适应不同浏览器窗口大小往往是一项费时的工作。