Browser support
All browsers support <meta> tags.
Definition and usage
The <meta> element provides meta-information about the page (meta-information), such as descriptions and keywords for search engines and update frequency.
The <meta> tag is located in the header of the document and does not contain any content. The properties of the <meta> tag define the name/value pairs associated with the document.
The difference between HTML and XHTML
The,<meta> tag does not have an end tag in HTML.
In XHTML, the,<meta> tag must be properly closed.
Tips and Comments:
Note The:<meta> tag is always inside the head element.
Note: Metadata is always passed in pairs in the form of a name/value.
Required Properties
Properties |
value |
Description |
Content |
Some_text |
Define meta information related to the HTTP-EQUIV or Name property |
Optional properties
Properties |
value |
Description |
Http-equiv |
- Content-type
- Expires
- Refresh
- Set-cookie
|
Associate the Content property to the HTTP header. |
Name |
- Author
- Description
- Keywords
- Generator
- Revised
- Others
|
Associate the Content property to a name. |
Scheme |
Some_text |
Defines the format used to translate content property values. |
examples of common methodsName property
The Name property provides the names in the name/value pairs. Neither HTML nor XHTML tags specify any pre-defined <meta> names. Typically, you are free to use a meaningful name for yourself and the reader of your source document.
"keywords" is a name that is often used. It defines a set of keywords for a document. Some search engines use these keywords to categorize documents when they encounter these keywords.
<meta name= "keywords" content= "html,asp,php,sql" >//a meta tag like this might be useful for indexing into search engines
or document description information
<meta name= "Author" content= "www.cnblogs.com/oospace/" >
<meta name= "Revised" content= "David yang,8/1/07" >
<meta name= "Generator" content= "Dreamweaver 8.0en" >
Or
<meta name= "viewport" content= "Width=device-width, initial-scale=1"/>//make the current page width equal to the width of the screen, often used to adapt to small screen devices such as mobile phone screen
Or
<meta name= "renderer" content= "WebKit"/>//is often used in multi-core browsers to use the Wekit kernel by default, such as some domestic browsers
If the Name property is not provided, then the names in the name/value pairs take the value of the Http-equiv property.
Http-equiv Property
The Http-equiv property provides a name for a name/value pair. and instructs the server to include a name/value pair in the header of the MIME document to be routed to the browser before sending the actual document.
When the server sends a document to the browser, many name/value pairs are sent first. Although some servers send many of these name/value pairs, all servers must send at least one: content-type:text/html. This tells the browser to be ready to accept an HTML document.
When using the <meta> tag with the Http-equiv property, the server adds a name/value pair to the header of the content sent to the browser. For example, add:
<http-equiv= "CharSet" content= "iso-8859-1"> < http-equiv= "Expires" content= "Dec">
The head that is sent to the browser should contain:
Content-type:text/htmlcharset:iso-8859-1expires:31 DEC 2008
Of course, these fields make sense only if the browser can accept these additional header fields and use them in the appropriate way.
Or
<http-equiv= "Content-type" Content= "text/html; Charset=utf-8" />//Setting Document type and encoding method
<meta http-equiv= "x-ua-compatible" content= "IE=12;IE=11;IE=10;IE=9; ie=8; "/>//Set IE browser to use its own kernel, disable compatibility mode <meta http-equiv=" x-ua-compatible "content=" Ie=emulateie12;ie=emulateie11 ; IE=EMULATEIE10;IE=EMULATEIE9;IE=EMULATEIE8 "/>//set IE browser to use its own rendering mode, disable compatibility mode
or
<http-equiv= "Refresh" content= "5;url=http://www.cnblogs.com/ oospace/"/>//page redirect, 5 seconds after automatically jump to the corresponding link
Content Properties
The Content property provides the value in a name/value pair. The value can be any valid string.
The content property is always used with the Name property or the Http-equiv property.
Scheme attribute
The scheme attribute is used to specify the scheme to be used to translate attribute values. This scenario should be defined in the profiles file specified by the profile property of the
Global Properties
The <meta> tag supports global properties in HTML. That is, commonly used properties
HTML Global Properties
5= the attribute added in HTML5.
Properties |
Description |
AccessKey |
Specifies the shortcut key for activating an element. |
Class |
Specifies one or more class names for an element (referencing a class in a style sheet). |
Contenteditable 5 |
Specifies whether the element content can be edited. |
ContextMenu 5
|
The context menu for the specified element. The context menu is displayed when the user clicks on an element. |
data-* 5 |
Private custom data that is used to store pages or applications. |
Dir |
Specifies the text direction of the content in the element. |
Draggable 5 |
Specifies whether the element can be dragged. |
Dropzone 5 |
Specifies whether to copy, move, or link while dragging the data that is being dragged. |
Hidden 5 |
The specified element is still not or is no longer relevant. |
Id |
The unique ID of the specified element. |
Lang |
The language that specifies the content of the element. |
SpellCheck 5 |
Specifies whether to check spelling and grammar of elements. |
Style |
The inline CSS style for the specified element. |
TabIndex |
Specifies the tab order of the elements. |
Title |
Specifies additional information about the element. |
Translate 5 |
Specifies whether the element content should be translated. |
Above.
HTML <meta> tag usage and use cases