移動端rem，vw,vh,百分比布局

pc端的px布局一般都會寫死固定寬高或者用min-width，max-width這種方式去做不同螢幕解析度適配，而移動端的布局要複雜的多。不同手機的寬高比例和螢幕尺寸都不太一樣，所以需要各種布局方式去適配

1.首先說rem布局，rem單位屬於乙個相對單位，也就是相對於根元素的html裡的font-size，一般來說根元素的font-size瀏覽器預設都為16px,也就是說，這個時候你在利用rem布局的時候，你的1rem則是16px

這樣的話導致在設計元素尺寸的時候非常不好計算，那麼我們就可以在html的初始css時設定乙個根元素font-size，但是有些瀏覽器，比如谷歌，預設字型大小不得小於12px,而且在移動端的瀏覽器進行瀏覽時

使用者為了個人習慣有的時候也會設定瀏覽器的字型大小，所以說在html中設定的根元素font-size更多是為了開發者便於計算頁面元素尺寸，為了維持瀏覽器預設大小，在body裡，一樣要設定回font-size為16px

這樣你在進行該網頁編輯的時候就不會影響到瀏覽器的預設字型

2.vw,vh,百分比布局，vh,和vw是兩個相對單位，視窗的寬度的百分之一就是1vw,vh同理，這個時候可能會產生疑惑，那麼vh和vw不就和百分比是一樣的，並不是，百分比的話是相對於當前元素的父元素的百分比

而vh和vw一直是相對於當前視窗的乙個單位長度，那麼視窗是什麼呢，從裝置來開始，到移動端顯示的區域，基本可以分為，裝置螢幕視窗，瀏覽器視窗，和當前網頁視窗，而vw和vh相對的是當前網頁的視窗寬

度高度。