一、允許網頁寬度自動調整
需於頭部加入viewport元標籤：
viewport是網頁預設的寬度和高度，"width=device-width"表示網頁寬度預設等於螢幕寬度，"initial-scale=1"表示原始縮放比例為1.0，即網頁初始大小佔螢幕面積的100%。
這個設定支援ie9以上版本的ie和主流瀏覽器，ie8一下需要使用css3-mediaqueries.js。
二、不使用絕對寬度
不能指定畫素寬度，只能使用百分比寬度。
三、相對大小的字型
字型大小設定不使用絕對大小(px)，而只能使用相對大小(em)。
四、流動布局
使用樣式 float
五、選擇性的載入css
css3引入了乙個新的模組media query,能夠使你的網頁自動探測螢幕寬度，然後載入相應的css檔案。
六、css的@media規則
七、的自適應
自適應網頁設計 自適應網頁設計技巧
隨著3g的普及，越來越多的人使用手機上網。移動裝置正超過桌面裝置，成為訪問網際網路的最常見終端。於是，網頁設計師不得不面對乙個難題 如何才能在不同大小的裝置上呈現同樣的網頁？手機的螢幕比較小，寬度通常在600畫素以下 pc的螢幕寬度，一般都在1000畫素以上 目前主流寬度是1366 768 有的還達...
自適應網頁設計
隨著3g的普及，越來越多的人使用手機上網。移動裝置正超過桌面裝置，成為訪問網際網路的最常見終端。於是，網頁設計師不得不面對乙個難題 如何才能在不同大小的裝置上呈現同樣的網頁？手機的螢幕比較小，寬度通常在600畫素以下 pc的螢幕寬度，一般都在1000畫素以上 目前主流寬度是1366 768 有的還達...
自適應網頁設計
自適應網頁設計 允許網頁寬度自動調整 允許網頁寬度自動調整 自適應網頁設計 首先，在網頁 的頭部，加入一行viewport元標籤。viewport是網頁預設的寬度和高度，上面這行 的意思是，網頁寬度預設等於螢幕寬度 width device width 原始縮放比例 initial scale 1 ...