移動端用rem使字型自適應

標籤：blog   pre   引入   16px   設定   字型大小   注意   自適應   css3   

　rem是css3引入的新的單位，與px和em相對比，我感覺rem更加便利，尤其是對移動端的字型調適型配置。

 

　rem是根據HTML的字型大小進行設定的。

　而HTML的基本字型大小是16px，所以可以加入如下代碼：

1 html {font-size: 62.5%;/*10 ÷ 16 × 100% = 62.5%*/}

　　這樣設定的意思是將HTML的font-size設定為10px，方便計算。

　　然後就可以可以使用rem作為單位了，將px換成rem是絕對可行的，如：

1 #div1{font-size: 1.4rem;}

　　因為rem是根據HTML字型大小（10px）來設定的，所以1.4rem即是14px。

　　但是注意，這樣直接設定固定大小在移動端並不適用……不信可以試試。

　　但是使用百分比就可以，如：

1 #div1{font-size: 140%rem;}

 　nuu，這樣就可以自適應了。

移動端用rem使字型自適應