1.文件
允許網頁寬度自動調整
//網頁的原始比例即為螢幕的大小，ie9+
viewport元標籤：網頁的預設寬度，
width=device-width,是說網頁的初始寬度等於螢幕的寬度，
initial-scale = 1,縮放比例為1倍
相容ie老版本需要支援
2.載入css
css3-media query
選擇性載入css
link標籤
css檔案中引入
@import url("a.css") screen and (max-device-width: 400px);
css檔案中@media 關鍵字
@media screen and (max-device-width: 400px) {}
3.布局
建議多使用流動布局，元素的定位是浮動的，float:right 等
.section
4.寬度
定義容器的寬度時不使用絕對的寬度畫素值
width:150px; ------ say no
width:20%; ------ say yes
width:auto; ------ say yes
5.字型大小
字型的大小使用相對大小單位em而不使用絕對大小px;
設定網頁字型的相對大小
body//字型大小是頁面預設大小的100%，為16個畫素。
設定字型的大小的時候，計算為em大小，如想設定字型大小為 32px 則 換算為em單位 font-size:2em;
6.、自**
img, object//的自適應，自動縮放
img//相容老ie
img//防止失真
imgsizer.js。
網頁自適應
文章入口 自適應 使用 viewport 標籤 viewport 是網頁預設的寬度和高度，上面這行 的意思是，網頁寬度預設等於螢幕寬度 width device width 原始縮放比例 initial scale 1 為1.0，即網頁初始大小佔螢幕面積的100 使用 百分比 或 em 要變化的不宜...
網頁自適應
允許網頁寬度自動調整 自適應網頁設計 到底是怎麼做到的？其實並不難。首先，在網頁 的頭部，加入一行viewport元標籤。viewport是網頁預設的寬度和高度，上面這行 的意思是，網頁寬度預設等於螢幕寬度 width device width 原始縮放比例 initial scale 1 為1.0...
網頁自適應
新增 自動的適應了手機端和pc端 首先，meta標籤儲存的是一些使用者不可見，但是瀏覽器可見的一些元資訊，一般以鍵值對的方式儲存。比如這個 name為鍵，鍵值為viewport。content為值，為 width device width,initial scale 1.0 然後其中 width d...