モバイル端末ブラウザ初期設定apple-mobile-web-app-capable

モバイルターミナルブラウザでは、デフォルトでビューポートの幅と初期サイズを設定します.最近作ったモバイル端末のプロジェクトで、デフォルト設定が変更されたという問題が発生しました.最初は自分のhtmlに問題があるのではないかと疑っていました.ページサイズのテストを経て、やっと問題の根源を見つけた.何の問題かが分かれば解決策が見つかる.以上の設定をページのヘッダファイルに追加すればOKです.以下に、これらの設定についての解析を示します.忘れないように記録する.しかし、これらの設定は、移動端末のブラウザでのみ有効であり、非移動端末ブラウザでは無効である.そして、これらのブラウザはiPhoneベースです.初めてモバイル端末の応用に触れて、悩ましいことはこれだけではありませんて、ほほほO(∩∩)O~然、この事は最も価値があります!
apple-mobile-web-app-capable
Sets whether a web application runs in full-screen mode.
Syntax

<meta name="apple-mobile-web-app-capable" content="yes">

Discussion
If  content  is set to  yes , the web application runs in full-screen mode; otherwise, it does not. The default behavior is to use Safari to display web content.
You can determine whether a webpage is displayed in full-screen mode using the  window.navigator.standalone  read-only Boolean JavaScript property.
Availability
Available in iPhone OS 2.1 and later.
Support Level
Apple extension.
apple-mobile-web-app-status-bar-style
Sets the style of the status bar for a web application.
Syntax

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

Discussion
This meta tag has no effect unless you first specify full-screen mode as described in  “url.”
If  content  is set to  default , the status bar appears normal. If set to  black , the status bar has a black background. If set to  black-translucent , the status bar is black and translucent. If set to  default  or  black , the web content is displayed below the status bar. If set to  black-translucent , the web content is displayed on the entire screen, partially obscured by the status bar. The default value is  default .
Availability
Available in iPhone OS 2.1 and later.
Support Level
Apple extension.
format-detection
Enables or disables automatic detection of possible phone numbers in a webpage in Safari on iPhone.
Syntax

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

Discussion
By default, Safari on iPhone detects any string formatted like a phone number and makes it a link that calls the number. Specifying  telephone=no  disables this feature.
Availability
Available in iPhone OS 1.0 and later.
Support Level
Apple extension.
viewport
Changes the logical window size used when displaying a page on iPhone.
Syntax

<meta name = "viewport" content = "width = 320,

       initial-scale = 2.3, user-scalable = no">

Discussion
Use the viewport meta key to improve the presentation of your web content on iPhone. Typically, you use the viewport meta tag to set the width and initial scale of the viewport.
For example, if your webpage is narrower than 980 pixels, then you should set the width of the viewport to fit your web content. If you are designing an iPhone-specific web application, you should set the width to the width of the device.
“email”  describes the properties supported by the viewport meta key and their default values. When providing multiple properties for the viewport meta key, you should use a comma-delimited list of assignment statements.
When referring to the dimensions of a device, you should use the constants described in  “number”  instead of hard-coding specific numeric values. For example, use  device-width  instead of 320  for the width, and  device-height  instead of  480  for the height in portrait orientation.
You do not need to set every viewport property. If only a subset of the properties are set, then Safari on iPhone infers the other values. For example, if you set the scale to  1.0 , Safari assumes the width is  device-width  in portrait and  device-height  in landscape orientation. Therefore, if you want the width to be 980 pixels and the initial scale to be 1.0, then set both of these properties.
For example, to set the viewport width to the width of the device, add this to your HTML file:

<meta name = "viewport" content = "width = device-width">

To set the initial scale to  1.0 , add this to your HTML file:

<meta name = "viewport" content = "initial-scale = 1.0">

To set the initial scale and to turn off user scaling, add this to your HTML file:

<meta name = "viewport" content = "initial-scale = 2.3, user-scalable = no">

Use the Safari on iPhone console to help debug your webpages as described in  “Debugging” . The console contains tips to help you choose viewport values—for example, it reminds you to use the constants when referring to the device width and height.
Availability
Available in iPhone OS 1.0 and later.
Support Level
Apple extension.
 
変換元:http://blog.sina.com.cn/s/blog_4dffbd380100kvht.html