使用 rem 設置文字大小（文字響應式）

　　響應式理念：響應式網頁不單單是響應不一樣類型的設備，並且須要響應不一樣的用戶需求。響應式的初衷是爲了讓信息更好的傳遞交流，讓全部人無障礙的獲取信息，同時這也是 Web 的初衷。

1、rem的定義

　　網頁中經常使用的文字大小單位是 px(Pixels)，em，如今新增了 rem 這個單位。

　　「rem」是指根元素（root element，html）的字體大小，根元素默認的 font-size 都是 16px。

2、兼容性

　　這樣一個新的單位兼容性如何呢？請出 Caniuse 看看吧

　　

　　太好了，IE9+，Firefox、Chrome、Safari、Opera 的主流版本都支持了

　　咱們知道 em 的計算是基於父級元素的，在實際使用中給咱們的計算帶來了很大的不便。因此 rem 的出現解救了我這樣不會算術的人，不再用擔憂父級元素的 font-size 了，由於它始終是基於根元素（html） 的。

　　好比默認的 html font-size=16px，那麼我想設置12px 的文字就是：12÷16=0.75（rem）

　　固然，咱們改變一下 html 的默認 font-size=10px 不就好計算了嘛！　　　　

　　　　html{
　　　　　　font-size:62.5%; /* 10÷16=62.5% */
　　　　}
　　　　body{
　　　　　　font-size:12px;
　　　　　　font-size:1.2rem ; /* 12÷10=1.2 */
　　　　}
　　　　p{
　　　　　　font-size:14px;
　　　　　　font-size:1.4rem;
　　　　}

　　須要注意的是，爲了兼容不支持 rem 的瀏覽器，咱們須要在 rem 前面寫上對應的 px 值，這樣不支持的瀏覽器能夠優雅降級。

3、爲何用rem

　　瀏覽器中用戶都是能夠自定義默認的文字大小的，若是使用 px，用戶自行在瀏覽器設置中改變了文字大小後，網頁上是不會變化的。而rem能夠（響應式網頁不單單是響應不一樣類型的設備，並且須要響應不一樣的用戶需求。）

4、何時用 rem

　　常在標題，正文等大面積文字的位置可使用 rem。可是在一些特殊的設計場景，rem 可能會致使佈局錯位

　　（參考淘寶響應式十日談）