用了好久的apple的一些meta屬性，突然想到怎麼沒看見像UC、QQ瀏覽器的，於是問了度娘，還真的是有。移動端裝置主要是iOS和Android兩類，從使用者量來看，Safari、UC、QQ是較多的3款瀏覽器了，因此整理了下移動web開發常用和3種瀏覽器的私有meta屬性。

1.常用屬性

<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0,minimum=1.0,user-scalable=no">
<meta name="format-detection"
 
 content="telephone=no, email=no">

1. ‘viewport’
   設定顯示方式，一般適配移動裝置用來避免縮放和影響體驗的滾動條
   width=device-width：寬度為裝置寬度
   initial-scale: 初始的縮放比例 （範圍從>0到 10 ）
   minimum-scale: 允許使用者縮放到的最小比例
   maximum-scale: 允許使用者縮放到的最大比例
   user-scalable: 使用者是否可以手動縮放
2. ‘format-detection’
   忽略頁面對手機號、email的識別
   telephone：yes|no
   email：yes|no

2.Safari瀏覽器私有meta屬性

<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="APP name">

1. ‘apple-mobile-web-app-capable’
   隱藏瀏覽器的位址列和toolbar，頁面顯示為全屏，不加此meta則預設顯示位址列和toolbar
   content：yes|no
2. ‘apple-mobile-web-app-status-bar-style’
   content：default|black| black-translucent，即白色、黑色、灰色半透明
3. ‘apple-mobile-web-app-title’
   新增到主屏後的標題

3.UC瀏覽器私有meta屬性

<meta name="screen-orientation" content="landscape">
<meta name="full-screen" content="yes">
<meta name="browsermode" content="application">
<meta name="layoutmode" content="fitscreen">
<meta name="nightmode" content="disable">
<meta name="imagemode" content="force">

1. ‘screen-orientation’螢幕方向
   強制頁面橫屏或豎屏顯示
   content：landscape|portrait
2. ‘full-screen’全屏
   進入全屏後，頁面隱藏選單欄, 生成一個懸浮標, 點選懸浮標可顯示選單欄
3. ‘browsermode’應用模式
   應用模式是為方便 web 應用及遊戲開發者設定的綜合開關，通過 meta 標籤進行指示開啟，當進入應用模式時，長按選單、預設手勢、夜間模式失效
4. ‘layoutmode’排版模式
   UC 瀏覽器供適屏模式及標準模式，其中適屏模式簡化了一些頁面的處理，使得頁面內容更適合進行頁面閱讀、節省流量及響應更快。而標準模式則能按照標準規範對頁面進行排版及渲染。
   content：fitscreen|standard
5. ‘nightmode’禁用夜間模式
   禁止頁面使用 UC 瀏覽器自定義的夜間模式
6. ‘imagemode’強制圖片顯示
   為了節省流量及加快速度，通過強制圖片顯示的功能可以保證圖片顯示不受使用者的設定影響。

4.QQ瀏覽器私有meta屬性

<meta name="x5-orientation" content="landscape">
<meta name="x5-fullscreen" content="true">
<meta name="x5-page-mode" content="default">

1. ‘x5-orientation’橫豎屏控制
   強制橫/豎屏以及跟隨瀏覽器設定【預設】
   content：landscape|portrait|auto
2. ‘x5-fullscreen’全屏控制
   強制全屏以及跟隨瀏覽器設定【預設】
   content：true|auto
3. ‘x5-page-mode’ 頁面模式
   普通瀏覽模式【預設】以及網頁應用模式（定製工具欄，全屏顯示）
   content：default|app