通常提到的佈局，有兩個共同點：
- 大多數用於 PC 端，因爲 PC 端屏幕像素寬度夠大，可佈局的空間也大；
- 佈局是有限空間內的元素排列方式，因爲頁面設計橫向不滾動，縱向無限延伸，所以大多數時候討論的佈局都是對水平方向進行分割。
我們在討論佈局的時候，會把網頁上特定的區域進行分列操作。按照分列數目，可以大致分爲 3 類，即單列布局、兩列布局、三列布局。
一、單列布局
單列布局是最常用的一種佈局，它的實現效果就是將一個元素作爲佈局容器，通常設置一個較小的（最大）寬度來保證不同像素寬度屏幕下顯示一致。
一些網站會將單列布局與其他佈局方式混合使用，這樣既能向下兼容窄屏幕，又能按照主次關係顯示頁面內容。
這種佈局的優勢在於基本上可以適配超過佈局容器寬度的各種顯示屏幕，比如網站佈局容器寬度爲 700px，也就是說超過 700px 寬度的顯示屏幕上瀏覽網站看到的效果是一致的。
但它最大的缺點也是源於此，過度的冗餘設計必然會帶來浪費。例如，屏幕寬度是足夠的，可以顯示更多的內容，但是頁面兩側卻出現了大量空白區域，如果在 4k 甚至更寬的屏幕下，空白區域大小會超過頁面內容區域大小！
實現
單列布局沒有太多技術難點，通過將設置佈局容器（最大）寬度以及左右邊距爲 auto 即可。