響應式布局的單位

1.vw和百分比區別

百分比代表相對寬度/高度，問題在于這個值相對什么。就是可以類似于相對定位的概念是相對于父元素的一般來說。而根元素body在沒有定義高度的情況下是沒有高度的。 而vh、vw不同，永遠都是相對于視窗大小的，即便寫在font-size里面也是按視窗大小。這個就會有很多很方便的地方了。所以用來開發多種屏幕設備的應用用這個單位還是挺合適的。

2.rem和em

em是相對于其父元素來設置字體大小的，這樣就會存在一個問題，進行任何元素設置，都有可能需要知道他父元素的大小。em在實際應用的時候因為跟隨父元素所以盡量用在部分代碼片段中，要不然計算不方便。 建議：如果是跟父元素成倍數關系縮放大小，可選擇em為單位；

rem是相對于根元素，這樣就意味著，我們只需要在根元素確定一個參考值。這個單位可謂集相對大小和絕對大小的優點于一身，通過它既可以做到只修改根元素就成比例地調整所有字體大小，又可以避免字體大小逐層復合的連鎖反應。目前，除了IE8及更早版本外，所有瀏覽器均已支持rem。對于不支持它的瀏覽器，應對方法也很簡單，就是多寫一個絕對單位的聲明。這些瀏覽器會忽略用rem設定的字體大小。下面就是一個例子：

3.建議