◎布局：1.固定布局：頁面寬度會被指定為像素px。使用最普遍寬度是960px。2.流動布局：頁面寬度會被指定為100%。優點：可使頁面具有可變的特性。可以設計一個占容器寬度60%的內容欄，一個占容器寬度30%的邊欄，和一個占容器寬度10%的分隔區域。不用再去關心瀏覽者的瀏覽器寬度，元素寬度會隨著瀏覽器視窗的寬度自動調整，不會出現水平滾動條。需要寫的CSS也相對較少。缺點：有些文字的行寬在大螢幕(例如：連網電視)看起來會太寬，而在小螢幕(例如:手機)看起來會太窄。3.彈性布局：頁面寬度會被單位指定為em。1em等於桌面瀏覽器預設的字型大小，大部分瀏覽器的預設大小為：16px，1em=16px、2em=32px。優點：為設計師在排版方面提供高度的控制權。可以將容器的寬度設定為55em，可以使容器維持在一個理想閱讀的寬度了。瀏覽者增大或縮小字型時，元素的寬度也會等比例變化。缺點：可能會出現水平滾動條。4.混合布局：結合上述兩種或兩種以上的布局方式。
