(轉)https://www.cnblogs.com/mylove103104/archive/2015/06/18/4584779.html

rem "em" 單位是我們開發中比較常用到的，它表示以當前元素的父元素的單位大小為基準來設置當前元素的大小；“rem” 中的 “r” 代表 “root”，它表示以根（即“html”）元素的單位大小為基準來設置當前元素的單位大小，所以不管當前元素是任意子節點，一旦設單位大小為 “rem” 那么這個元素大小都是以根元素單位為參考的，這里的“em” 和 “rem”?均具有繼承性。

2.vw和vh（移動端開發個人最喜歡的單位屬性，也是這次介紹的重點） 傳統的響應式開發中，我們常常用百分比來布局，然而這并不是最好的解決方案。例如，你沒有辦法以body的高度來設置百分比。 "vw" 的全稱是 “viewport width” 即視窗的寬度；"vh" 的全稱是 “viewport height” 即視窗的高度。 1vw = viewportWidth * 1/100；?1vh = viewportHeight * 1/100； 所以元素使用 “vw” “vh” 作為寬度和高度單位，即可以保證適配不同的設備。

3. vmin 和 vmax“vmin” 即 “viewport” 寬度和高度相比較最小的那一個。（也就是說，如果當前元素單位設置了 “vmin” 那么瀏覽器會去判斷寬度和高度的大小，然后繼承小的值）“vmax” 同理，繼承寬高比較，大的那一個值；即，寬和高誰大，就繼承誰的值。這里我們假設：瀏覽器的寬度為1300px，高度為960px； 50vmin = 960 * (50/100)； 50vmax = 1300 * (50/100)；

總結

以上是生活随笔為你收集整理的移动端开发, 常用CSS单位的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。