前端人員在處理移動端自適應布局時，目前前端最流行的方法應該就是使用媒體查詢，來設置HTML的字體大小，然后用rem為單位對Dom的寬高進行設置，這個方法的優勢在于兼容性方面很好，劣勢則在于當前市場上不同的機型太多，尺寸種類比較雜，所以要想做到所以尺寸機型都能適應，工作量相對比較大。目前也有人會選擇用百分比進行布局，這個布局方法在僅僅處理元素的寬高上面非常好用，但是當js中要對dom元素的尺寸進行設置時，百分比的局限性就出來了，還有就是dom元素的font-size沒辦法用頁面寬度百分比對他進行大小設置，也就是一個元素寬高在占比頁面50%時，一段文字會在不同寬度的手機屏幕上顯示不同的行數。如下：

這是在iPhone4中的顯示，

這是在iPhone6中的顯示，

因此如何讓頁面所有元素都能做到自適應，這是目前需要解決的問題。這時候，C3中的一個新的長度單位——VW。這個單位的說明是：相對于視口的寬度。視口被均分為100單位的vw，也就是說在375寬度的屏幕中，1vw等于3.75px，320的屏幕中，1vw等于3.2px。這樣的話對于不同尺寸的屏幕有了一個統一的單位來進行衡量，這時我們再結合rem，即對HTML設置字體大小font-size：calc(100vw/18.75)——這是以iPhone6的尺寸為設計圖時做的計算，此時在iPhone6尺寸的頁面中1rem為20px；通過對設計圖的還原，此時頁面元素的大小已經可以等比例適應任意寬度的終端了。

這是通過這個設置在iPhone4中的顯示效果：

這是通過設置在iPhone6中的顯示效果：

我們可以看到，兩種機型上的顯示效果已經完全一樣了。

當然，這種方法目前存在的最大問題仍然是兼容問題

目前VW單位的兼容性仍然不容樂觀，但是對在做混合APP的部分同行來說，基本就不存在這個問題了，并且隨著設備的更新迭代，相信在將來通過這種方法進行布局將會逐漸普及開來