Declaring the character encoding used by a document
<meta charset= ' Utf-8 ' >
Declaring compatibility Mode for documents
Instructs IE to display content in the highest mode currently available <meta http-equiv= "x-ua-compatible" content= "Ie=edge"/>//indicates IE uses <! The doctype> directive determines how the content is rendered. The standard mode instruction is displayed in IE7 Standard mode, while the Quirks mode instruction is displayed in IE5 mode. <meta http-equiv= "x-ua-compatible" content= "Ie=emulate IE7"/>
Prevents the browser from reading data from the local cache when the page is loaded (cannot browse offline)
<meta http-equiv= "Pragma" content= "No-cache" >
SEO optimization
Page description
<meta name= "description" content= "no more than 150 characters"/>
Page keywords
<meta name= "keywords" content= "HTML5, CSS3, keywords"/>
Define page Authors
<meta name= "Author" content= "Magic Little Stack"/>
Define the page search engine index method, Robotterms is a set of comma, the value of the split, usually have the following values: None,noindex,nofollow,all,index and follow.
<meta name= "Robots" content= "Index,follow"/>
Add viewport to a mobile device
<meta name = "Viewport" content = "width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, User-scalable=no ">
Content parameters:
IOS devices
Title added to the home screen (IOS 6 new)
<meta name= "Apple-mobile-web-app-title" content= "title" >
Whether to enable WEBAPP full screen mode
<meta name= "apple-mobile-web-app-capable" content= "yes"/>
Set the background color of the status bar
<meta name= "Apple-mobile-web-app-status-bar-style" content= "Black-translucent"/>
Only "apple-mobile-web-app-capable" content="yes"
when it is in effect
Content parameters:
-
default
The default value.
black
The status bar background is black.
black-translucent
The status bar background is black translucent.
If set to default
or black
, the page content starts at the bottom of the status bar.
If set to black-translucent
, the page content fills the entire screen, the top is obscured by the status bar.
IOS icons
Rel parameter:
apple-touch-icon
Images are automatically processed into rounded corners and highlights.
apple-touch-icon-precomposed
Prevents the system from automatically adding effects, directly displaying the original design.
IPhone and ITouch, default 57x57 pixels, must have
<link rel= "apple-touch-icon-precomposed" href= "/apple-touch-icon-57x57-precomposed.png"/>
ipad,72x72 pixels, can not, but recommended to have
<link rel= "apple-touch-icon-precomposed" sizes= "72x72" href= "/apple-touch-icon-72x72-precomposed.png"/>
Retina IPhone and retina itouch,114x114 pixels, can not, but recommended to have
<link rel= "apple-touch-icon-precomposed" sizes= "114x114" href= "/apple-touch-icon-114x114-precomposed.png"/>
Retina ipad,144x144 pixels, can not, but recommended to have
<link rel= "apple-touch-icon-precomposed" sizes= "144x144" href= "/apple-touch-icon-144x144-precomposed.png"/>
IOS splash Screen
The IPad splash screen does not include the status bar area.
IPad Vertical screen 768 x 1004 (Standard resolution)
<link rel= "Apple-touch-startup-image" sizes= "768x1004" href= "/splash-screen-768x1004.png"/>
IPad Vertical Screen 1536x2008 (Retina)
<link rel= "Apple-touch-startup-image" sizes= "1536x2008" href= "/splash-screen-1536x2008.png"/>
IPad Horizontal screen 1024x748 (standard resolution)
<link rel= "Apple-touch-startup-image" sizes= "1024x748" href= "/default-portrait-1024x748.png"/>
IPad Horizontal screen 2048x1496 (Retina)
<link rel= "Apple-touch-startup-image" sizes= "2048x1496" href= "/splash-screen-2048x1496.png"/>
The splash screen for IPhone and IPod touch includes the status bar area.
Iphone/ipod Touch Vertical Screen 320x480 (standard resolution)
<link rel= "Apple-touch-startup-image" href= "/splash-screen-320x480.png"/>
Iphone/ipod Touch Vertical Screen 640x960 (Retina)
<link rel= "Apple-touch-startup-image" sizes= "640x960" href= "/splash-screen-640x960.png"/>
IPhone 5/ipod Touch 5 Vertical screen 640x1136 (Retina)
<link rel= "Apple-touch-startup-image" sizes= "640x1136" href= "/splash-screen-640x1136.png"/>
Windows 8
Windows 8 Tile Color
<meta name= "Msapplication-tilecolor" content= "#000"/>
Windows 8 Tile icon
<meta name= "Msapplication-tileimage" content= "Icon.png"/>
Other
Add an RSS Subscription
<link rel= "Alternate" type= "Application/rss+xml" title= "RSS" href= "/rss.xml"/>
Add Favicon icon
<link rel= "shortcut icon" type= "Image/ico" href= "/favicon.ico"/>
No digital knowledge automatic phone number
<meta name= "format-detection" content= "Telephone=no"/>
Do not allow Android to recognize mailboxes
<meta name= "format-detection" content= "Email=no"/>
Meta Tags Common Properties summary