正確使用2016年的CSS3 VW和VH作爲響應式和CrossBrowse網站

Question

如果在2016年是正確的時間和地點使用css3 vw & vh單位來創建響應式網站，從我的經驗來看，這是最簡單的方法做到這一點......但我幾乎沒有看到使用這種技術的地方。爲什麼？如果你有更好的辦法做響應網站的請求份額...

Answer 1

VH和VW是相對於視口的高度/寬度，所以他們是理想的比例基礎上，視口大小的元素。

例如，如果你想用二列布局，指定每個列的寬度爲50vw將很好地工作。根據Can I Use如果不需要使用vmax，瀏覽器支持是很好的。

縮放是響應式設計的一個方面，另一個正在改變頁面佈局。
由於正確地低於George Chanturia指出，以下意見參考自適應設計，沒有響應式設計。

說你想你的2欄佈局崩潰到智能手機上的一列，你可能需要使用媒體查詢和像素或REMS或EMS

如

@media only screen and (max-width: 25em) { 
... 
} 

或

@media only screen and (max-width: 400px) { 
... 
} 

可以肯定的，你可以使用VM和大衆的媒體查詢內，但它不是你可以在實際的媒體查詢測試功能。

希望這會有所幫助。