的特點是分別為不同的屏幕分辨率定義布局,即創(chuàng)建多個靜態(tài)布局,每個靜態(tài)布局對應一個屏幕分辨率范圍。改變屏幕分辨率可以切換不同的靜態(tài)局部,但在每個靜態(tài)布局中,頁面元素不隨窗口大小的調(diào)整發(fā)生變化。可以把看作是靜態(tài)布局的一個系列,網(wǎng)頁通過媒體查詢的方法自動選擇相對應的CSS樣式。
1.自適應布局特點
,屏幕分辨率變化時,頁面里面元素的位置會變化而大小不會變化。根據(jù)不同的屏幕分辨率切換不同的布局樣式,使整個網(wǎng)頁看起來與使用的設備完美匹配。
2.自適應布局設計方法
使用 @media 媒體查詢給不同尺寸和介質(zhì)的設備切換不同的樣式。在優(yōu)秀的響應范圍設計下可以給適配范圍內(nèi)的設備最好的體驗,在同一個設備下實際還是固定的布局。
缺點:(1)媒體查詢是有限的,也就是可以枚舉出來的,只能適應主流的寬高。(2)要匹配足夠多的屏幕大小,工作量不小,設計也需要多個版本。
3.自適應布局的缺點
優(yōu)點很完美,缺點也很明顯。一般會根據(jù)不同的主流屏幕做多個媒體查詢,這樣往往會增加CSS樣式的書寫復雜程度,同時,一旦網(wǎng)頁布局發(fā)生改動后期維護工作量相當之大。
免費咨詢:18838171308