上篇有寫到移動端開發-媒體查詢 + rem，那麼移動端開發了除了媒體查詢還有什麼方法能快速的去實現呢？
下面我就來介紹一下vw+ rem開發移動端。
首先我們先了解幾個知識點：vw、vh、drp
1、vw：viewpoint width，視口的寬度，1vw 等於視口寬度的 1%；100vw = 視口的寬度的100%；
2、vh：viewpoint height，視口的高度，1vh等於視口高度的1%；/3、dpr：像素比，
做開發的時候，如果設計給了你一張移動端爲1080或者750或者640的設計圖不瞭解這個的話就瘋了，這麼大的設計圖，怎麼做移動端呀，所以在這裏會存在一個像素比，設計圖量出來的尺寸就是物理像素，我們實際上要寫入代碼的叫做邏輯像素，那麼dpr就是邏輯像素和物理像素的比；
dpr = 邏輯像素 / 物理像素，dpr的取值怎麼取呢？
（1）如果你的設計圖是750px,那麼邏輯像素就是750px,那麼dpr的取值就是2；比如你量出來的height=120px；那麼我們實際寫在代碼中的邏輯像素= 120px（物理像素） / 2（dpr） = 60px;
（2）如果你的設計圖是640px,那麼邏輯像素就是640px,那麼dpr的取值就是2；比如你量出來的height=120px；那麼我們實際寫在代碼中的邏輯像素= 120px（物理像素） / 2（dpr） = 60px;
（3）如果你的設計圖是1080px,那麼邏輯像素就是1080px,那麼dpr的取值就是3；比如你量出來的height=120px；那麼我們實際寫在代碼中的邏輯像素= 120px（物理像素） / 3（dpr） = 40px;
dpr就是固定的取值，具體這個值去2還是3，就看你們的設計圖辣。
好啦，那下面我們來看看vw 結合rem怎麼去使用吧！
（1）如果設計圖爲640px，那麼邏輯像素的話爲320px,那麼100vw = 320px,那麼1px = 0.3125vw;
我們就只要給根節點設置：
html {
font-size:0.3125vw；
}
比如其他元素的寬高設置：60rem = 120px量出來的物理像素 / dpr（2）;就夠能隨着設備不同而相應的去改變啦。
（2）如果設計圖爲750px，那麼邏輯像素的話爲375px,那麼100vw = 375px,那麼1px = 0.26.67vw;
我們就只要給根節點設置：
html {
font-size:0.26.67vw；
}
（3）如果設計圖爲1080px，那麼邏輯像素的話爲360px,那麼100vw = 360px,那麼1px = 0.27.78vw;
我們就只要給根節點設置：
html {
font-size:0.27.78vw；
}
比如其他元素的寬高設置：40rem = 120px量出來的物理像素 / dpr（2）;就夠能隨着設備不同而相應的去改變啦。
哈哈哈。。有沒有覺得超級簡單，其實瞭解了，真的很方便的去實現移動端佈局啦。