CSS網頁版面入門教學2：一列自適應寬度_基礎教學

自適應佈局是網頁設計中常見的佈局形式，自適應的佈局能夠根據瀏覽器視窗的大小，自動改變其寬度和高度值，是一種非常靈活的佈局形式，良好的自適應佈局網站對不同分辨率的顯示器都能提供最佳的顯示效果。實際上div預設狀態的佔據整行的空間，便是寬度為100%的自適應佈局的表現形式，一列自適應佈局需要我們做的工作也非常簡單，只需要將寬度由固定值改為百分比值的形式即可。

複製程式碼 程式碼如下:

#layout { 
    border: 2px solid # A9C9E2; 
    background-color: #E8F5FE; 
    height: 200px; 
    width: 80%使用樣式屬性都提供了百分比，width寬度屬性也不例外，在這裡我們將寬度由一列固定寬度的300px，改為80%，從下邊的預覽效果中可以看到，div的寬度已經改變了瀏覽器寬度的80%的值。自適應的優勢是當擴大或縮小瀏覽器視窗大小時，其寬度也會維持在與瀏覽器目前寬度的比例。

<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>AA25.CN_娑</title>