1,流式布局
使用非固定像素來定義網頁內容,也就是百分比布局,通過盒子的寬度設置成百分比來根據屏幕的寬度來進行伸縮,不愛固定像素的限制,內容向兩側填充。這樣的布局方式,就是移動web開發使用的常用布局方式。這樣的布局可以適配移動端不同的分辨設備。
2,響應式開發
那么Ethan Marcotte在2010年5月份提出的一個概念,簡而言之,就是一個網站能夠兼容多個終端。越來越多的設計師也采用了這種設計。
CSS3中Media Query(媒介查詢),通過查詢screen的寬度來指定某個寬度區間的網頁布局。
超小屏幕(移動設備) 768px以下
小屏設備 768px-992px
中等屏幕 992px-1200px
寬屏設備 1200以上
由于響應式開發顯得繁瑣些,一般使用第三方響應式框架來完成,比如bootstrap來完成一部分工作,當然也可以自己寫響應式。