理解em,rem以及rem的失效問題

　　在日常作網站寫代碼的時候通常都是使用px，在以前的學習時就略微的學習了一些關於em、rem的知識，可是因爲一直沒有用到過，因此幾乎所有忘記了。今天在研究一些知識的時候用到了em，因此特地將學到的知識總結一下。

1.em

em是相對長度單位，相對於當先對象中的字體尺寸。好比在某個div中font-size設置爲20px，那麼，1em就至關於20px，0.25em就至關於5px。因爲瀏覽器的默認字體大小爲16px，因此爲了簡化font-size的換算，就要在body的選擇器中將font-size設置爲62.5%，換算成像素，就是16*62.5%=10px，這樣在以後的設置尺寸大小的時候就能夠用1.2em表明12px，也就是說此時的換算關係就是1em=10px。

值得注意的是em會集成父級元素的字體大小。因此不要輕易的在當前元素中改變em。

2.rem

rem和em有類似的使用方法，都是相對長度單位。不一樣的是rem須要在根元素html的css選擇器中設置font-size,設置font-size爲14px，則1rem就是14px。使用這個長度單位的好處是能夠用於作適配。能夠直接在<hmtl>中更改font-size就能夠在不一樣的移動端顯示不一樣大小的元素。咱們都知道瀏覽器默認的字體大小都是16px,所以在一些書中會這樣寫到：將html的font-size設置成62.5%，這樣就是10px,那麼接下來的0.1rem就是1px了，這樣好算。可是，在實際中我發如今谷歌瀏覽器中這個方法是不可行的。

　　由於在谷歌瀏覽器中的默認字體大小雖然是16px，可是在html中卻不能夠將字體設置小於12px，若是小於12px就會默認以12px來計算。這樣的話咱們的62.5%爲10px就破滅了。因此在我看來可能最好的方法就是設置成爲20px了，也就是在html中設置字體爲125%或是直接20px。

 

資料來源：http://www.cnblogs.com/leejersey/p/3662612.html