常見的css布局方式有:1.靜態布局,傳統布局方式;2.流式布局,可以進行適配調整;3.自適應布局,為不同屏幕分辨率設置不同布局;4.響應式布局,屏幕尺寸不同,頁面顯示的內容不同;5.彈性布局,確保元素擁有恰當行為;
常見的css布局方式有以下幾種
1.靜態布局
靜態布局是傳統的布局方式,網頁中所有尺寸都是由px作為單位,設置了min-width,如果寬度小于就會出現滾動條,如果大于這個寬度則內容居中外加背景,靜態布局具有布局簡單、沒有兼容性問題的特點。
2.流式布局
流式布局是指屏幕分辨率變化時,頁面里元素的大小會變化而但布局不變,網頁中主要的劃分區域的尺寸使用百分數,分別為不同的屏幕設置布局格式,當屏幕大小改變時,會出現不同的布局,流式布局的特點是隨著屏幕的改變,頁面布局沒有發生大的變化,可以進行適配調整。
3.自適應布局
自適應布局是為不同的屏幕分辨率分別定義不同的布局,自適應布局中可以通過改變屏幕分辨率可以切換不同的靜態布局,且自適應布局中元素的位置會變化,可以解決空間利用率不高弊端。
4.響應式布局
響應式布局是指當屏幕尺寸不一樣時,展示給用戶的網頁內容也不一樣,可以使網站在手機或平板中有更好的瀏覽閱讀體驗,響應式布局中每個屏幕分辨率下面會有一個布局樣式,即元素位置和大小都會變。
5.彈性布局
彈性布局是一種當頁面需要適應不同的屏幕大小以及設備類型時確保元素擁有恰當行為的布局方式,彈性布局中可以對一個容器中的子元素進行排列、對齊和分配空白空間,且支持所有的瀏覽器。