手機網頁開發簡單總結

手機螢幕的寬度不統一，我們強制給文件設定乙個比例

"
viewport
" content="
width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;
" />

定義：device-width是通知瀏覽器使用裝置的寬度作為可視區的寬度，initial-scale初始的縮放比例，minimum-scale允許使用者縮放到的最小比例，maximum-scale允許使用者縮放到的最大比例，user-scalable定義是否可以縮放（0為不縮放）。

2.使手機瀏覽網頁時，不啟用**功能，忽視頁面上的數字識別為**，可以做如下設定

"
format-detection
" content="
telephone=no
" />

3.很多人都認為手機網頁像pc端網頁一樣，可以設定字型，其實各個手機系統有自己的預設字型，且都不支援我們最常用的的微軟雅黑，所以不是特定需求可以不規定字型，英文本型和數字字型可使用「helvetica」，三種系統(ios、android、winphone)都支援。

4.手機開發有特殊要求時需要單獨給元素新增樣式，我們在樣式裡可以這樣做

1》.首先頭部宣告

"
viewport
" content="
width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;
" />

2》.判斷裝置是橫屏還是豎屏

@media all and (orientation : portrait)
/*樣式**塊*/
}

@media all and (orientation : landscape) 
/*樣式**塊*/
}