Meta Tag Summary

Source: Internet
Author: User
Tags home screen

keywords,description (two frequently used)

Page keywords and descriptions , is written to search engines to see, keywords can have multiple "," separated

<Meta name= "keywords" content="html,css,javascript,php" >

<Meta name= "description" content= "HTML META tag Daquan, finishing up the memory enhancement" >

<meta name= "Author" content= "[email protected]"/>

Content-typeTell the browser which type of resource is currently being accessed

<Meta http-equiv= "content-type" content= "text/html; charset=gb2312 "/><!--tell the browser which type of resource is currently accessed and declare the code- -

RefreshRedirect (The following example jumps to: Http://blog.csdn.net in 5 seconds)

<Meta http-equiv="Refresh" content= "5;url="/http/blog.csdn.net "/>

Full-screenFull-screen display of Web pages (proprietary properties of some mobile browsers)

<Meta name="Full-screen" content="yes"/>

BrowsermodeBrowser mode-Enforce screen display (the proprietary properties of some mobile browsers),

<Meta name= "browsermode" content="Application"/>

format-detectionData Format Validation Rendering:

Telephone: While the iphone will automatically add your text to the link style, and click on this number will automatically dial! Enabled by default
Email: The browser will recognize the mailbox and add style, click can call the system default mail app to send an email to the address, the default open
adress: Adress=yes opens the function of clicking the address to jump directly to the map, which is turned on by default

<meta content= "Telephone=no" name= "Format-detection"/>
<meta content= "Email=no" name= "format-detection"/>//will not recognize mailbox
Tell the device to ignore numbers in the page as phone numbers

<Meta content= "telephone=no" name="Format-detection"/>
<Meta content= "telephone=no,email=no,adress=no" name="format-detection"/>

x5-orientationQQ Browser Force Vertical screen

<meta name="x5-orientation" content="portrait"/>

X5-fullscreenQQ Browser Force full Screen

<meta name="x5-fullscreen" content="true"/>

X5-page-modeQQ Browser Application Mode

<meta name="x5-page-mode" content="app"/>

x-ua-compatible

IE Compatibility mode: Which version of IE to render the page (ie=8: In IE8 mode to render the page, Ie=edge: To the latest version of IE to render the page, of course, this latest refers to your system installed the highest version of IE)

<meta Http-equiv= "x-ua-compatible" content= "ie=8"/>

<meta http-equiv="X-UA-Compatible" content="IE=Edge" />

Enderer

This seems to be 360 browser-specific, compatible with 360 of the weapon Ah, 360 default is to use IE7 to render the page, regardless of your system installed a high version of IE, this behavior is the industry cancer AH.

<meta name="renderer" content="webkit">//默认webkit内核

<meta name="renderer" content="ie-comp">//默认IE兼容模式

<meta name="renderer" content="ie-stand">//默认IE标准模式

Expires (term)

Description: Specifies the expiration time of the page in the cache and must be re-accessed on the server once the page expires.
Usage: <meta http-equiv= "Expires" content= "0″/>
<meta http-equiv= "Expires" Content= "Wed, 1997 08:21:57 GMT"/>
Note: You must use the time format of GMT, or set directly to 0 (the number indicates how much time expires after).

Pragma (Cach mode)

Description: Prevents the browser from accessing the contents of the page from the local machine's cache.
Usage: <meta http-equiv= "Pragma" content= "No-cach"/>
Note: pages are not guaranteed to be present in the cache, and each visit refreshes the page. With this setting, visitors will not be able to browse offline.

Set-cookie (Cookie setting)

Description: When a browser accesses a page, it is cached and can be read from the cache the next time it is accessed to improve speed.
Disable caching when you want visitors to refresh your ad's icon every time, or refresh your counter every time.
Usually HTML files do not need to disable caching, for the ASP and other pages, you can use the disable cache, because every time you see the page is dynamically generated on the server,
The cache loses its meaning. If the page expires, the saved cookie will be deleted.
Usage: <meta http-equiv= "Set-cookie" content= "COOKIEVALUE=XXX; Expires=wednesday,
21-oct-98 16:14:21 GMT; path=/">

Window-target (display window settings)

Description: Forces the page to appear on a separate page in the current window.
Usage: <meta http-equiv= "Widow-target" content= "_top" >
Note: This property is used to prevent others from calling your page in the frame. Content options: _blank, _top, _self, _parent

Pics-label (web Rsac rating)

< Span class= "hljs-string" > Description: There is a content setting in Internet Options for IE that prevents you from browsing some restricted sites, and the site's restricted-level
is set by this parameter.
Usage: <meta http-equiv= "Pics-label" contect= "(pics-1.1′http://www.rsac.org/ratingsv01.html '
I gen comment ' RSACi North America Sever "by" [email protected] '
for ' http://www.microsoft.com ' on ' 1997.06.30t14:21-0500′r ( N0 s0 v0 l0) ";
Note: Do not set the level too high. The RSAC evaluation system provides a standard for evaluating Web site content.
Users can set up Microsoft Internet Explorer (IE3.0 or more) to exclude sites that contain pornographic and violent content.
The HTML in the example above is taken from Microsoft's home page. The code (n 0 S 0 v 0 L 0) indicates that the site does not contain unhealthy content. The
level is assessed by RSAC, the rating agency of the American Entertainment Commission, if you want to learn more about the level of RSAC evaluation system, or if you need to evaluate your own website, you can visit the RSAC site: http://www.rsac.org/.

Content-script-type (script related)

Description: This is the latest specification of the Web, indicating the type of script in the page.
Usage: <meta http-equiv= "Content-script-type" content= "Text/javascript"/>

RSS Site Map-sitemap

Copy the code to a sitemap.xml (or ror.xml) file and upload it to your app's root directory.
and add the following code to your site home page
<link rel= "Alternate" type= "Application/rss+xml" title= "ROR" href= "Sitemap.xml"/>

If your sitemap filename is ror.xml, remember to change the href in the above code to href= "Ror.xml"
<link rel= "Alternate" type= "Application/rss+xml" title= "ROR" href= "Ror.xml"/>

Favorite Icons

<link rel= "shortcut icon" href= "Http://c.csdnimg.cn/public/favicon.ico" >

Content-type and Content-language (setting of the display character set)

Description: Sets the character set used by the page to illustrate the language of the text used in the homepage production,
Based on this, the browser invokes 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"/>
Attention:
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 browser will prompt you to correctly display the page need to download 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 prompts 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 code.

Main mate uses in the WebApp

<meta name= "Apple-touch-fullscreen" content= "yes" > Added to the Home screen, full screen display.

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

The META function is to delete the default Apple toolbar and menu bar. The content has two values "yes" and "no", and when we need to display the toolbar and menu bar, the row meta is not added, the default is display.

<meta name= "Apple-mobile-web-app-status-bar-style" Content=black "/>

Defaults are default (white), which can be set to Black (dark) and black-translucent (gray translucent).
Note: If the value "Black-translucent" will occupy the page px position, floating above the page (will cover the page 20px height –iphone4 and itouch4 Retina screen is 40px).
<meta name= "apple-mobile-web-app-capable" content= "yes" >
<meta name= "Apple-mobile-web-app-status-bar-style" content= "Black-translucent" >

There are two meta values in iOS, apple-mobile-web-app-capable and Apple-mobile-web-app-status-bar-style, both of which make the Web content appear in the app style and make the status bar transparent.

<link rel= "apple-touch-icon-precomposed" href= "Http://spion.blog.163.com/blog/iphone_milanoo.png"/>
Note: This link is to set the Web App placement on the Home screen icon file path.
Image size can be set to 57*57 (px) or retina can be set to 114*114 (px), ipad size is 72*72 (px)

Apple-touch-icon

<link rel= "Apple-touch-icon" href= "/static/images/identity/html5_badge_64.png"/>
<link rel= "apple-touch-icon-precomposed" href= "/static/images/identity/html5_badge_64.png"/>

iOS with rel= "Apple-touch-icon", Android with Rel= "apple-touch-icon-precomposed". This allows you to create an app-style icon in your phone's home screen when the user saves the page as a bookmark.

<meta name="sharecontent" data-msg-img="thumbnail address" data-msg-title="title" data-msg-content ="Introduction" data-msg-callback= " data-line-img=" thumbnail address " data-line-title=" title " data-line-callback=""/>

ps:

Tell the browser what version of the IE compatibility mode to display the page <meta http-equiv= "x-ua-compatible" content= "ie=5" > <meta http-equiv= "X-ua-compatib Le "content=" ie=7 "> <meta http-equiv=" x-ua-compatible "content=" ie=8 "> <meta http-equiv=" X-UA-Compatib    Le "content=" Ie=edge "> where the last line is always displayed in the latest IE version mode. Plus emulate mode <meta http-equiv= "x-ua-compatible" content= "Ie=emulateie7" > <meta http-equiv= "X-UA-Compatibl E "content=" IE=EMULATEIE8 "> Emulate mode is more important after <! Doctype> (the attentive person will notice that the Compatible View button does not appear when using IE9 to access pages with x-ua-compatible)

Meta Tag Summary

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.