固定布局經不起未來考驗 固定像素尺寸的網頁是匹配固定像素尺寸顯示器的最簡單辦法。但這種方法不是一種完全兼容未來網頁的制作方法，我們需要一些適應未知設備的方法。 為什么響應式設計需呀百分比布局 僅使用媒體查詢來適應不同視口的固定寬度設計，只會從一組CSS媒體查詢規則突變到另一組，兩者間 ...

流式布局（百分比布局） 在CSS2時代就有，主要指的是將頁面中元素的寬度以百分比表示並進行排版，可以在不同分辨率下顯示相同的版式 響應式布局 關鍵技術是CSS3中的媒體查詢，可以在不同分辨率下對元素重新設置樣式（不只是尺寸），在不同屏幕下可以顯示不同版式 　　舉例 ...

　　一、百分比布局（又名流式布局） 　　流式布局的特點就是采用display：flex；來控制整體布局，文字會隨着屏幕的寬度自動延伸，彈性控件的空間會隨着屏寬逐漸加大但不會自動增大，圖片采用百分比進行縮放。 　　二、rem布局（又名等比縮放布局） 　　 　　單位： 　　em ...

響應式布局是什么？ 一、什么是響應式布局？   響應式布局就是一個網站能夠兼容多個終端——而不是為每個終端做一個特定的版本。這個概念是為解決移動互聯網瀏覽而誕生的。   響應式布局可以為不同終端的用戶提供更加舒適的界面和更好的用戶體驗。 二、響應式布局 ...

如果布局使用百分比寬度，在不同的顯示器上效果可能不太一樣。固定像素尺寸的網頁是匹配固定像素尺寸顯示器的最簡單辦法。將固定像素寬度轉換對應的百分比寬度： 目標元素寬度/上下文元素寬度=百分比寬度 em代替px主要是為了文字縮放。針對老版本IE，現在瀏覽器支持縮放像素為單位的文字了。優點：1.使用 ...

關於float。 一般情況，使用float能使所在的div層懸浮於當前所在頁面的上方（比如第一層圖）； 使用clear能消除這種懸浮效果。（比如第二層圖） 注意：使用floa ...

摘自阮老師的博客 點擊查看運行效果 ...

基礎概念 屏幕尺寸 屏幕對角線的長度（cm） 屏幕像素密度 屏幕密度是指一個設備表面上存在的像素數量，它通常以每英寸有多少像素來計算(PPI)。 屏幕分辨率 橫縱向上物理像素 ...