p { font-size: small; }

默认keyword:

xx-small
x-small
small
medium
large
x-large
xx-large
smaller  (相对值，relative to parent）
larger  （相对值，relative to parent）

不能精细（fine-grained）控制字体

px

在电脑屏幕上，没有什么能比一个像素更精确了。设置像素是设置文字的height.

但是在IE 6一下浏览器里，font-sizes set in pixels cannot be resized by the user.

em

em 恐怕是最难以理解的值了，大概因为它表示的内容很抽象和武断。 1em 等于当前元素的font-size，如果在页面的任何地方都没有设置font size，它就是浏览器默认的font-size，大概是16px。所以默认 1em = 16px。如果对body设置font-size为20px，那么 1em = 20px.

使用em的通常方法是设置body font-size 为62.5%，因为浏览器默认font-size为16px，62.5%的大小就是10px。使用10可比使用16容易多了。比如你想要设置font size为18px，就设置font-size: 1.8em。

另外一点就是em是相对值，总是相对parent元素的font-size。(em values compound)

em不仅仅用于fonts，它也是一个用于其他长度的单位（height，width，等等）。

test: 默认情况下 { body: 62.5%; } 后 firefox font-size: 5.86667px; chrome font-size: 6.25px; 原因是我使用的html, body { font-size: 62.5%; } 导致结果成了 ` font-zie = 62.5%*62.5%`。 chrome 可能受用户设置影响chrome://settings/fonts，最小font-size 12px，你可以手动修改它。

rem

rem的出现就是为了避免compounding问题。rem relative to the root html element, not the parent element.

html { font-size: 62.5%; }
span { font-size: 1.6rem; }
<span>Outer <span>inner</span> outer</span>

%

如果parent font-size 20px, child font-size 50%, 那么child就是10px。 其中一个使用percentage的场景就是设置一个基础的font-size，然后child都使用percentage，然后通过改变一个地方从而将整个child都改变，例如常用的改变文章文字大小。

pt

pt(point values), Point values are only for print CSS! 72pts = one inch.

@media print {
    body {
      font-size: 10pt;
    }
}