用rem在移動端不同解析度下的完美顯示
對於App來說，需要適應各種移動端的解析度。為了解決這一問題，我也是各種買書，查部落格得到一種適配性比較好的方法。就是rem。
rem（font size of the root element）是指相對於根元素的字型大小的單位。簡單的說它就是一個相對單位。看到rem大家一定會想起em單位，em（font size of the element）是指相對於父元素的字型大小的單位。它們之間其實很相似，只不過一個計算的規則是依賴根元素一個是依賴父元素計算。
不僅是App能使用rem，PC端網頁也能使用rem，只不過rem在App下出於相容性的考慮作用更加的大。
rem能等比例適配所有解析度。
rem是通過根元素進行適配的，網頁中的根元素指的是html我們通過設定html的字型大小就可以控制rem的大小。舉個例子：
html{
font-size:20px;
}
.btn {
width: 6rem;
height: 3rem;
line-height: 3rem;
font-size: 1.2rem;
display: inline-block;
background: #06c;
color: #fff;
border-radius: .5rem;
text-decoration: none;
text-align: center;
}
假設就使用瀏覽器預設的字號16px，來看一些px單位與rem之間的轉換關係：
如果你要設定一個不同的值，那麼需要在根元素<html>中定義，為了方便計算，時常將在<html>元素中設定font-size值為62.5%，相當於在<html>中設定font-size為10px；
rem在眾多瀏覽器中都已得到很好的支援，如果您的專案不用考慮IE低版本的話，你就可以放心的使用了，如果您的專案在IE低版本中還佔有不少的比例，那麼你還在擔心使用rem不能相容，而不敢使用。其實是沒有必要的，可以針對低版本的IE瀏覽器做一定的處理：
html { font-size: 62.5%; }
body { font-size: 14px; font-size: 1.4rem; }
h1 { font-size: 24px; font-size: 2.4rem; }