Width: the width of the viewport. The value ranges from 200 to 10,000. The default value is 980 pixels)
Height: the height of the viewport. The value ranges from 223 to 10,000)
Initial-scale: initial scaling ratio (range:> 0 to 10)
Minimum-scale: minimum scale that allows users to scale
Maximum-scale: maximum scale allowed by users
User-scalable: whether the user can manually Scale
Whether to delete the default Apple toolbar and menu bar
After the app format is set, the function is to control the display style of the status bar, but it is not changed after the ios7 test on the local machine ...... Puzzled
The iPhone recognizes a string of numbers as phone numbers. When you click the phone number, it will prompt whether to call the phone number. If this function is disabled, telephone is set to No,
To enable the telephone function, use <a href = "Tel: 13888888888"> call me: 13888888888 </a> instead,
The email is <a href = "mailto: [email protected]? Subject = Hello % 20 again "> send email </a>
<! -- Enable the speed mode of the 360 browser (WebKit) --> <meta name = "Renderer" content = "WebKit"> <! -- Avoid ie using compatibility mode --> <meta http-equiv = "X-UA-compatible" content = "Ie = edge"> <! -- Optimized for handheld devices, mainly for some old browsers that do not recognize viewport, such as BlackBerry --> <meta name = "handheldfriendly" content = "true"> <! -- Microsoft's old-fashioned browser --> <meta name = "mobileoptimized" content = "320"> <! -- UC force portrait --> <meta name = "Screen-orientation" content = "portrait"> <! -- QQ Forced vertical screen --> <meta name = "x5-orientation" content = "portrait"> <! -- UC force full screen --> <meta name = "full-screen" content = "yes"> <! -- QQ forced full screen --> <meta name = "x5-fullscreen" content = "true"> <! -- UC application mode --> <meta name = "browsermode" content = "application"> <! -- QQ application mode --> <meta name = "x5-page-mode" content = "app"> <! -- Windows Phone click "NONE" --> <meta name = "msapplication-tap-highlight" content = "no">
In addition, Apple has two interesting labels:
1. Apple-touch-icon
<LINK rel = "apple-touch-icon" sizes = "76x76" href = "touch-icon-ipad.png">
Ifapple-mobile-web-app-capableSetyesThen, you can add the website to the home screen on Apple's Safari by adding the button to the home screen. And set the correspondingapple-touch-iconLabel, then the icon added to the home screen will use the image we specified.
2. Apple-touch-startup-Image
<LINK rel = "apple-touch-startup-image" href = "/startup.png">
Based onapple-mobile-web-app-capableSetyesYou can set a startup screen similar to nativeapp for the webapp. Andapple-touch-iconDifferent,apple-mobile-web-app-capableThe sizes attribute is not supported. You must use media to load different startup screens. Query desert articles in detail.
// iPhone<link href="apple-touch-startup-image-320x460.png" media="(device-width: 320px)" rel="apple-touch-startup-image" />// iPhone Retina<link href="apple-touch-startup-image-640x920.png" media="(device-width: 320px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
Therefore, for mobile terminals, write the general starting template as the snippet of sublime:
<snippet> <content><
