頭部必須要加的

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

　　<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>

　　<meta name="MobileOptimized" content="320">

　　<meta name="format-detection" content="telephone=no">

　　<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

3、移動web頁面自動探測電話號碼

<meta name="format-detection" content="telephone=no">

<meta http-equiv="x-rim-auto-match" content="none">

結論

• 各個手機系統有自己的預設字型，且都不支援微軟雅黑
• 如無特殊需求，手機端無需定義中文字型，使用系統預設
• 英文字型和數字字型可使用 Helvetica ，三種系統都支援

/* 移動端定義字型的程式碼 
 
*/
body{font-family:Helvetica;}

大多數手機不支援的：

• 表單元素的“disable”屬性

部分手機不支援的：

• “button”標籤
• “input[type=file]“標籤
• “iframe”標籤。

雖然只有部分手機不支援這幾個標籤，但因為這些標籤在頁面中往往具有非常重要的功能，所以屬於高危標籤，要謹慎使用。

少數手機不支援的：

• “select”標籤：該標籤如果被賦予比較複雜的CSS屬性，可能會導致顯示不正常，比如”vertical-align:middle”。

大部分手機不支援的：

• “font-family”屬性：因為手機基本上只安裝了宋體這一種中文字型；
• “font-family:bold;”：對中文字元無效，但一般對英文字元是有效的；
• “font-style: italic;”：同上；
• “font-size”屬性：比如12px的中文和14px的中文看起來一樣大，當字元大小為18px的時候你也許能看出來一些區別；
• “white-space/word-wrap”屬性：無法設定強制換行，所以當你網頁有很多中文的時候，需要特別關注不要讓過多連寫的英文字元撐開頁面；
• “background-position”屬性：但背景圖片的其他屬性設定是支援的；
• “position”屬性；
• “overflow”屬性；
• “display”屬性；
• “min-height”和”min-weidth”屬性；

部分手機不支援的：

• “height”屬性：對”height”的支援不太好，奇怪的是在我們的測試當中，僅僅只有很少部分手機不支援”width”屬性；
• “pading”屬性
• “margin”屬性：更高比例的手機不支援”margin”的負值。

少數手機不支援的：

• 少數手機對CSS完全不支援；

其他

• 部分手機不支援png8和png24，所以儘量使用jpg和gif的圖片
• 另外對於平滑的漸變等精細的圖片細節，部分手機的色彩支援度並不能達到要求，所以慎用有平滑漸變的bar設計
• 部分手機對於超大圖片，既不進行縮放，也不顯示橫下滾動條
• 少數手機在開啟超過20k的測試頁面時，會顯示記憶體不足

• 手機網頁編碼需要遵循什麼規範？ 遵循XHTML Mobile Profile規範，簡稱為XHTML MP，也就是通常說的WAP2.0規範。 XHTMLMP是為不支援XHTML的全部特性且資源有限的客戶端所設計的。它以XHTML Basic為基礎，加入了一些來自XHTML 1.0的元素和屬性。這些內容包括一些其他元素和對內部樣式表的支援。和XHTML Basic相同，XHTML MP是嚴格的XHTML 1.0子集。
• 網頁文件推薦使用副檔名？ 推薦命名為xhtml，按WAP2.0的規範標準寫成html/htm等也是可以的。但少數手機對html支援的不好。
• 為什麼現今大多數的網站一行字數上限為14箇中文字元？ 由於手持裝置的特殊性，其頁面中實際文字大小未必是我們在CSS中設定的文字大小，尤其是在第三方瀏覽器中。例如Nokia5310，其內建瀏覽器 頁面內文字大小與CSS設定相符，但是第三方瀏覽器OperaMini與UCWEB頁面內文字大小卻大於CSS設定。經測試，其文字大概在16px左右。 假如螢幕解析度寬度為240px，去除外邊距，那麼其一行顯示14個字以內，是比較保險（避免文字換行）的做法。
• 使用WCSS還是CSS？ WCSS (WAP Cascading Style Sheet 或稱 WAP CSS)是移動版本的CSS樣式表。它是CSS2的一個子集，去掉了一些不適於移動網際網路特性的屬性，並加入一些具有WAP特性的擴充套件（如-wap-input-format/-wap-input-required/display:-wap-marquee等）。 需要留意的是，這些特殊的屬性擴充套件並不是很實用，所以在實際的專案開發當中，不推薦使用WCSS特有的屬性。
• 避免空值屬性 如果屬性值為空，在web頁面中是完全沒有問題的，但是在大部分手機網頁上會報錯。
• 網頁大小限制 建議低版本頁面不超過15k，高版本頁面不超過60k。
• 用手機模擬器和第三方手機瀏覽器的線上模擬器來測試頁面是不是靠譜？ 有條件的話，我們當然建議在手機實體上進行測試，因為目標客戶群的手機裝置總是在不斷變化的，這些手機模擬器通常不能完全正確的模擬頁面在手機上的顯示情況，比如圖片色彩，頁面大小限制等就很難再模擬器上測試出來。當然，一些第三方手機瀏覽器的線上模擬器還是可以進行測試的，第三方瀏覽器相對來說受手機裝置的影響較小。