移動端開發，幾個你可能不知道的CSS單位屬性。

1. 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)；

4. ex 和 ch

這兩個單位在咱們平時開發中會不多用到，這裏就不作詳細的闡述了。下面就放一張圖解釋這兩個單位的含義，如果有興趣的朋友的能夠本身查一下資料。