I just know the properties of Meta in WAP app

I have been doing all the Web front-end development, to Beijing after the interview of a mobile front-end development, WAP front-end development.

In fact, in the original company has also done this aspect of development, can interview when the interviewer asked me, want to force the document and the width of the device to keep 1:1,mate label should add what attributes, I froze a bit, because originally I write this aspect of code when I didn't pay attention to this problem, I thought in *. The HTML file adds <!. DOCTYPE HTML PUBLIC "-//wapforum//dtd XHTML Mobile 1.0//en" "HTTP://WWW.WAPFORUM.ORG/DTD/XHTML-MOBILE10.DTD"; It's all right. Unexpectedly, there are a lot of curved inside, out of curiosity, I looked up some information about the meta attribute in mobile app, here to share with you:

The following is a meta-description of each attribute   in particular, it is important to note that the settings for multiple properties in the content must be separated by semicolons + spaces, which will not work if the specification is not.   A, <meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 ">   //encoded  meta tag is an accessible tag in the head area of the HTML language, which is located between the tag of the header of the HTML document and the caption << tag, which provides information that is not visible to the user. Meta tags are often used to define page themes for search engine robots, or to define a cookie on a   user's browser; it can be used to identify the author, format the page, annotate the content feed and keywords, and set the page to refresh itself according to the intervals you define. and set the RASC content level, and so on.   Details   Here are some examples and explanations of the markings. The   META tag is divided into two parts: HTTP header information (HTTP-EQUIV) and page description information (NAME).  ★HTTP-EQUIV  Http-equiv is similar to the HTTP header protocol, which responds to the browser with some useful information to help correct and accurately display the content of the Web page. Commonly used HTTP-EQUIV types are:  1, Content-type, and content-language (setting of the display character set) transferred from the global net to the global net edu24ol.com transferred from the Universal School edu24ol.com  Description: Sets the character set used by the page to indicate that the text used by the home page is already spoken, and the browser will invoke the corresponding character set to display the page content.   Usage: <meta http-equiv= "Content-type" content= "text/html;　charset=gb2312 ">  <meta http-equiv=" content-language "content=" ZH-CN ">  Note: The META tag defines the character set used by the HTML page as GB2132, which is the GB character code. If you replace "charset=gb2312" with "BIG5", the character set used for this page is the traditional Chinese Big5 code. When you   browse some foreign sites, IE will prompt you to display the page correctly to download the XX language support. This is done by reading the Content-type property of the META tag of the HTML page and knowing which character set to use to display the page. If the corresponding character set is not installed in the   system, IE will prompt to download. Other languages also correspond to different charset, such as the Japanese character set is "ISO-2022-JP", the Korean is "ks_c_5601".   Content-type Content can also be: Text/xml and other document types;  charset options: Iso-8859-1 (English), BIG5, UTF-8, Shift-jis, Euc, Koi8-2, Us-ascii, X-mac-roman, Iso-8859-2, X-mac-ce, ISO-2022-JP, X-sjis, X-euc-jp, euc-kr, Iso-2022-kr, gb2312, gb_ 2312-80, X-EUC-TW, X-cns11643-1,x-cns11643-2 and other character sets; the Content of Content-language can also be: EN, FR and other language codes.   II, <meta id= "viewport" name= "viewport" content= "width=320"; initial-scale=1.0;maximum-scale=1.0; User-scalable=no; " />//the zoom  1 of the screen. viewport:  is also the visible area. For desktop browsers, we all know exactly what viewport is, and that's what's going on. All toolbars, status bars, scrollbars, and so on are used to look at the area of the page,  this is a truly effective area. Because the mobile device screen width is different from the traditional web, we need to change the viewport;  actually we can manipulate the property has 4:  width-             // viewport width (range from 200 to 10,000, default is 980 pixels)  height-            // viewport height (range from 223 to  initial-scale)-    //  Initial scaling (range from >0 to 10) & Nbsp;minimum-scale-   //   allow user to zoom to the minimum scale  maximum-scale-   //    Allows the user to zoom to the maximum scale  user-scalable-   //   Whether the user can manually indent (no,yes)  <meta content= " Width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0; "Name=" viewport ">  the first meta tag indicates:       force the document to remain 1:1;      the width of the device The maximum width of the document is 1.0 (Initial-scale Initial and Maximum-scale max scale values) than the column;       User-scalable defines whether it is scalable (0 is not scaled), so that the size of the page is fixed on the device.   (note: The actual test found that HTC G7 its own system browser does not support this rule, can enlarge the page, once the enlarged response box also enlarged, resulting in Russian page confusion problem, solution: Define the minimum width of the page    min-width,body{min-width:300px;} )   Third, <meta name= "apple-mobile-web-app-capable" content= "yes"/>  //another tip for offline apps    < Meta name= "Apple-mobile-web-app-status-bar-style" content= "Black"/>  //Hide Status bar \  Description: Web App support is enabled on the Web site.    Here's a detailed description of what iOS devices do to these two meta functions (the app is known as an "offline app", but it's literally misunderstood and thought to be out of the web, so I'm still using the Web app to describe it.) :  This meta can be seen as "Apple device Web application xx", meaning that meta is a .  description that specifically defines the web App:      on the web The color of the status bar (at the top of the screen) of the app app is;      default (white), which can be set as black (black) and black-translucent (gray translucent).   Note:      If the value of "Black-translucent" will occupy the page px position, floating above the page (will cover the page 20px height – The Retina screen for iphone4 and ITOUCH4 is 40px).   Correction: Before reviewing some information, said Apple-mobile-web-app-status-bar-style property is hidden status bar, in fact, this is a misunderstanding, here for everyone to correct this problem.   Apple Web App other settings:  of course, the icon and launch interface with the Web App require additional two-terminal code settings, as follows:  <link rel= " Apple-touch-icon-precomposed "href=" iphone_milanoo.png "/>  Description: This link is to set the Web App placement on the Home screen icon file path.   using:      the path needs to be noted in the root directory of the document that is placed under the document root of the Web site but not the server.       image size can be set to 57*57 (px) or retina can be set to 114*114 (px), ipad size is 72*72 (px)  <link rel= " Apple-touch-startup-image "href=" milanoo_startup.png "/>  Description:       this link is to set the start-up interface, the placement of the road is similar to the above.   using:      the path needs to be noted in the root directory of the document that is placed under the document root of the Web site but not the server.       official requirements for the start-up interface must be 320*640 (px), originally thought that the retina screen can support double, but not support, the picture does not appear.          Four, <meta content= "Black" name= " Apple-mobile-web-app-status-bar-style "/>//The style of the status bar on safari top in the specified iphone     <meta content= "Telephone=no" name= "format-detection"/>  <meta content= "Email=no" name= "format-detection"/>//will not recognize mailbox   tells the device to ignore numbers on the page as phone numbers     make phone calls to numbers when the device is browsing the page (different device interpretations, itouch Click Numbers to deposit contacts, iphone for phone calls), Ignores numbers in the page as phone numbers.   If you need to enable the phone function will be telephone=yes, the specific call format can write code <a href= "13888888888″>call me</a&gt, if there is Google Maps on the page, The itunes and YouTube links will open the appropriate program components on your iOS device.  <meta name= "Author" contect= "mr.he"/>//Author's name

Properties of Meta in WAP app I just knew