HTML <meta> 元素表示那些不能由其它HTML元相关元素 (<base>, <link>, <script>, <style><title>) 之一表示的任何元数据信息.



注意: 全局属性 name<meta> 元素中具有特殊的语义;另外, 在同一个 <meta> 标签中,name, http-equiv 或者 charset 三者中任何一个属性存在时,itemprop 属性不能被使用。


此特性声明当前文档所使用的字符编码,但该声明可以被任何一个元素的 lang 特性的值覆盖。此特性的值必须是一个符合由IANA所定义的字符编码首选MIME 名称(preferred MIME name )之一。尽管标准不要求必须使用某些特定的字符编码,但它还是给出了一些建议:

  • 鼓励使用 UTF-8;
  • 不应该使用不兼容ASCII的编码规范, 以避免不必要的安全风险:浏览器不支持他们(这些不规范的编码)可能会导致浏览器渲染html出错. 比如JIS_C6226-1983JIS_X0212-1990HZ-GB-2312JOHAB,ISO-2022 系列,EBCDIC系列 等文字 

注意:非兼容ASCII编码就是那些不会将8位代码点的0x20 到 0x7E 映射为Unicode代码点 0x0020 到 0x007E 的编码)

  • 开发者必须禁用 CESU-8UTF-7BOCU-1 或 SCSU 这些字符集,因为这些字符集已经被证实存在跨站脚本攻击(XSS)的风险。
  • 开发者应尽量避免使用 UTF-32字符集对网页进行编码,因为不是所有的HTML5编码算法能够将其与 UTF-16 编码区分开来。
  • 声明的字符编码必须与页面保存所使用的编码相匹配,以避免乱码和安全漏洞.
  • <meta> 元素必须包含在 <head> 元素中并且在HTML代码的前1024个字节内,因为某些浏览器在选择编码之前只查看前面这些字节。
  • <meta>元素只是algorithm to determine the character set 中的一部分。 HTTP的Content-Type头部以及任何Byte-Order Marks元素都优先于此元素。
  • 强烈建议使用该属性定义字符编码. 如果未定义,某些跨脚本技术可能危害网页,如 UTF-7 fallback cross-scripting technique. 保持设置该属性以避免类似风险。
  • <meta> 元素 的charset属性和以下HTML5内容<meta http-equiv="Content-Type" content="text/html; charset=IANAcharset">等效,其中 IANAcharset 包含了charset 一样的值后者的语法仍然是允许的,但是不再推荐。
此属性包含http-equiv 或name 属性的值,具体取决于所使用的值。
这个枚举属性定义了能改变服务器和用户引擎行为的编译。这个编译值使用content 来定义,如下:
使用方式: 不要使用这个指令,因为它已经过时了。使用 <html> 元素上全局的 lang 属性来替代它.
它允许页面作者定义当前页的 内容策略。 内容策略主要指定允许的服务器源和脚本端点,这有助于防止跨站点脚本攻击。
这个属性定义了文档的 MIME type , 实际上由它的字符编码决定。它遵循与HTTP content-type 头部字段相同的语法, 但由于它位于HTML页面内,因此除了text / html之外的大多数值都不能使用。 因此,其content的有效语法是字符串'text / html',后跟一个具有以下语法的字符集:';charset=IANAcharset,其中IANAcharset是IANA定义的字符集的首选MIME名称。
Usage note:
  • 不要使用该指令因为它已过时。. 使用<meta> 元素的charset 属性 代替。
  • As the <meta> may not be used to change the type of a document in an XHTML document, or in an HTML5 document following the XHTML syntax, never set MIME type to an XHTML MIME type that way. It would be incorrect.
  • Only an HTML document can use the content-type, so most of it is redundant: that's why it has been obsoleted and replaced by the charset attribute.
这个属性指定了在页面上使用的首选样式表. content属性必须包含<link> 元素的标题, href属性链接到CSS样式表或包含CSS样式表的<style>元素的标题.
  • 如果content 只包含一个正整数,则是重新载入页面的时间间隔(秒);
  • 如果content 包含一个正整数并且跟着一个字符串,则是重定向到指定链接的时间间隔(秒)
为页面定义cookie。其内容必须遵循 IETF HTTP Cookie 规范中定义的语法。
Note: 警告:请勿使用此说明,因为它已过时。请改用HTTP的Set-Cookie头部。
该属性定义文档级元数据的名称。如果以下其中一个属性设置了itemprop, http-equiv or charset ,就不能在设置这个属性了。

此元数据名称与content 属性包含的值相关联。name属性的可能值为:
  • application-name,定义正运行在该网页上的网络应用名称;
    • 浏览器可能会通过使用该属性去区分应用。It is different from the <title> element, which usually consist of the application name but may also contain specific information like the document name or a status;
    • 简单的网页不应该去定义application-name meta标签。
  • author,就是这个文档的作者名称,可以用自由的格式去定义;
  • description,其中包含页面内容的简短和精确的描述。 一些浏览器,如Firefox和Opera,将其用作书签页面的默认描述。
  • generator, 包含生成页面的软件的标识符。
  • keywords, 包含与逗号分隔的页面内容相关的单词。
  • referrer 控制所有从该文档发出的 HTTP 请求中HTTP Referer 首部的内容:
    <meta name="referrer"> content 属性可取的值:
    no-referrer 不要发送 HTTP Referer 首部。
    origin 发送当前文档的 origin
    no-referrer-when-downgrade 当目的地是先验安全的(https->https)则发送 origin 作为 referrer ,但是当目的地是较不安全的 (https->http)时则不发送 referrer 。这个是默认的行为。
    origin-when-crossorigin 在同源请求下,发送完整的URL (不含查询参数) ,其他情况下则仅发送当前文档的 origin
    unsafe-URL 在同源请求下,发送完整的URL (不含查询参数)。
    注意:动态地插入<meta name="referrer"> (通过 document.write 或者 appendChild) 是不起作用的。同样注意如果同时有多个彼此冲突的策略被定义,那么 no-referrer 策略会生效。

The attribute may also have a value taken from the extended list defined on WHATWG Wiki MetaExtensions page. Although none has been formally accepted yet, a few commonly used names are among the proposals:

  • creator, defining, in a free format, the name of the creator of the document. Note that it can be the name of the institution. If there are more than one, several <meta> elements should be used;
  • googlebot, which is a synonym of robots, but is only followed by Googlebot, the indexing crawler for Google;
  • publisher, defining, in a free format, the name of the publisher of the document. Note that it can be the name of the institution;
  • robots, defining the behavior that cooperative crawlers should have with the page. It is a comma-separated list of values taken in the following list:
    Values for the content of <meta name="robots">
    Value Description Used by
    index Allows the robot to index the page All
    noindex Prevents the robot from indexing the page All
    follow Allows the robot to follow the links on the page All
    nofollow Prevents the robot from following the links on the page All
    noodp Prevents the usage of the Open Directory Project description, if any, as the description of the page in the search engine results page

    Google, Yahoo, Bing

    noarchive Prevents the search engine from caching the content of the page Google, Yahoo
    nosnippet Prevents the display of any description of the page in the search engine results page Google
    noimageindex Prevents this page from appearing as the referring page of an indexed image Google
    noydir Prevents the usage of the Yahoo Directory description, if any, as the description of the page in the search engine results page Yahoo
    nocache Synonym of noarchive Bing
    • Only cooperative robots will follow the rules defined by the robots name. Do not expect to keep e-mail harvesters at bay with this.
    • The robot still needs to access the page in order to read the meta value. If you want to keep them at bay, for example to prevent bandwidth consumption, use a robots.txt file instead (or in complement).
    • If you want to remove the page of an index, changing the meta to noindex will work, but only when the robot visit the page again. Be sure not to prevent such visits, via the robots.txt file for example. Some search engines have developers tools, allowing a quick removal of some page.
    • Some possible values are mutually exclusive, like using index and noindex, or follow and nofollow, at the same time. In these cases the behavior of the robot is undefined, and may vary from one to the other. So avoid these cases.
    • Some search engine crawler robots, like those of Google, Yahoo Search or Bing, support the same values on an HTTP directive, X-Robot-Tags: this allows them to use these pragma on non-HTML documents, like images.
  • slurp, 与robots一样, 但其仅使用于 Slurp -- Yahoo Search的抓取工具。
  • viewport, 它提供有关视口初始大小的提示,仅供移动设备使用。
    • 值的内容为: <meta name="viewport">
      Value 可能值 描述
      width 一个正整数或者字符串 device-width 以pixels(像素)为单位, 定义viewport(视口)的宽度。
      height 一个正整数或者字符串 device-height 以pixels(像素)为单位, 定义viewport(视口)的高度。
      initial-scale 一个0.0 到10.0之间的正数 定义设备宽度(纵向模式下的设备宽度或横向模式下的设备高度)与视口大小之间的缩放比率。
      maximum-scale 一个0.0 到10.0之间的正数 定义缩放的最大值;它必须大于或等于minimum-scale的值,不然会导致不确定的行为发生。
      minimum-scale 一个0.0 到10.0之间的正数 定义缩放的最小值;它必须小于或等于maximum-scale的值,不然会导致不确定的行为发生。
      user-scalable 一个布尔值(yes 或者no 如果设置为 no,用户将不能放大或缩小网页。默认值为 yes
      规范 Status Comment
      CSS Device Adaptation
      <meta name="viewport">
      Working Draft 非规范地描述了Viewport META元素
      See also: @viewport
      • 虽然标准化程度不高,但由于事实上的支配地位,大多数移动浏览器都尊重这一声明。
      • 不同设备和浏览器之间的默认值可能不同。
      • 要在Firefox for Mobile中了解此声明,请参阅 this article.
This attribute defines the scheme in which the metadata is described. A scheme is a context leading to the correct interpretations of the content value, like a format.
Notes: Do not use this attribute as it is obsolete. There is no replacement for it as there was no real usage for it. Omit it altogether.


Depending on the attributes set, the kind of metadata can be one of the following:

  • If name is set, it is document-level metadata, applying to the whole page.
  • If http-equiv is set, it is a pragma directive — information normally given by the web server about how the web page is served.
  • If charset is set, it is a charset declaration — the character encoding used by the webpage.
  • If itemprop is set, it is user-defined metadata — transparent for the user-agent as the semantics of the metadata is user-specific.


<!-- Defining the charset in HTML4 -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<!-- In HTML5 -->
<meta charset="utf-8">

<!-- Redirect page after 3 seconds -->
<meta http-equiv="refresh" content="3;url=http://www.mozilla.org/">


Refreshing content

Pages set with a refresh value run the risk of having the time interval being too short. People navigating with the aid of assistive technology such as a screen reader may be unable to read through and understand the page's content before being automatically redirected. The abrupt, unannounced updating of the page content may also be disorienting for people experiencing low vision conditions. 

Viewport scaling

Disabling zooming capabilities by setting user-scalable to a value of no prevents people experiencing low vision conditions from being able to read and understand page content.


Specification Status Comment
Referrer Policy
<meta name="referrer">
Candidate Recommendation Defines value and semantic of <meta name="referrer">.
HTML Living Standard
Living Standard  
HTML 4.01 Specification

Browser compatibility

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support (Yes) 1.0 (1.7 or earlier) (Yes) (Yes) (Yes)
name="referrer" 17 36.0 (36.0) ? ? ?
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support (Yes) 1.0 (1.0) (Yes) (Yes) (Yes)
name="referrer" ? 36.0 (36.0) ? ? ?

See also


最后编辑者: ceido,