對響應式布局的理解和認知
隨著互聯網的快速發展，HTML5迅速崛起，響應式布局也慢慢的被廣泛的運用起來，身為之後的Web前端人員，我覺得應該要掌握“響應式布局”。
響應式布局，簡單點說就是做一個網站而能多終端多平臺運行的由一個網站轉化為多個網站，為我們大大節省了資源。
那麽響應式布局有什麽優缺點呢？
優點： 1.響應式布局面對不同的分辨率設備靈活性強。
2.能夠快捷解決多設備顯示適應問題。
缺點：
1.兼容各種設備工作量大，效率低下。
2.代碼累贅，會出現隱藏無用的元素，加載時間加長。
3.其實這是一種折衷性質的設計解決方案，多方面因素影響而達不到最佳效果。
4.一定程度上改變了網站原有的布局結構，會出現用戶混淆的情況。
可能有些人還是不明白響應式布局應該怎麽去做，以及它的開發原理是什麽？
原理
所有網頁響應式布局代碼都是這一句：
<meta name="viewport" content="width=device-width,
initial-scale=1.0, maximum-scale=1.0,user-scalabe=0">
解析：
width:賦值為固定像素或者某個特殊的值,比如device-width.
指的是100%時的像素
height:和width一樣
initial-scale=1.0,第一次加載網頁時顯示的比例.
maximum-scale=1.0:允許用戶手動縮放的最大比例
user-scalable=0.值為0代表不允許用戶手動縮放.
這段代碼的意思是:
讓viewport的分辨率等於物理設備上的真實分辨率,
不允許用戶修改,可以保證顯示效果真實細膩.
media query能夠獲取哪些值?
設備的寬和高device-width，device-heigth顯示屏幕/觸覺設備。
渲染窗口的寬和高width，heigth顯示屏幕/觸覺設備。
設備的手持方向，橫向還是豎向orientation(portrait|lanscape)和打印機等。
畫面比例aspect-ratio點陣打印機等。
設備比例device-aspect-ratio-點陣打印機等。
對象顏色或顏色列表color，color-index顯示屏幕。
設備的分辨率resolution。
對響應式布局的理解和認知