描述HTML文档的元数据

<head>
  <meta name="description" content="免费在线教程">
  <meta name="keywords" content="HTML,CSS,XML,JavaScript">
  <meta name="author" content="runoob">
  <meta charset="UTF-8">
</head>

简介

元数据（Metadata）是数据的数据信息
<meta>标签提供了HTML文档的元数据。元数据不会显示在客户端，但是会被浏览器解析。
META元素通常用于指定网页的描述，关键词，文件的最后修改时间，作者及其他元数据。
元数据可以被使用浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他web服务调用。

<meta>标签通常位于head区域内
元数据通常以名称/值对出现
meta有个必须的属性content用于表示需要设置的项的值
如果没有提供name属性，那么名称/值对中的名称会采用http-equiv属性的值

属性

属性	值	描述
charset	charscter_set	定义文档的字符编码（html5新属性）
content	text	定义与http-equiv或name属性相关的元信息
http-equiv	content-type、default-style、refresh	把content属性关联到http头部
name	application-name、author、description、generator、keywords	把content属性关联到一个名称
scheme	format/URI	html5不支持。定义用于翻译content属性值的格式

这里我们来说一些name、http-equiv属性的值分别有什么作用。

name属性

name属性主要用于描述网页，对应属性是content，以便与搜索引擎机器人查找、分类。

语法

<meta name="参数" content="参数值" />

属性值

Keyword（关键字）

使用：<meta name="keywords" content="meta, html, 标签" />
作用：为搜索引擎提供的关键字列表

Description（简介）

使用：<meta name="description" content="meta标签的介绍和使用讲解" />
作用：description用来告诉搜索引擎你的网站主要内容

robot（机器人向导）

all：文件被检索，且页面上的链接可以被查询
none：文件将不被检索，且页面上的链接不可以被查询
index：文件将被检索
follow：页面上的链接可以被查询
noindex：文件将不被检索，单页面上的链接可以被查询
nofollow：文件将被检索，单页面上的链接不可以被查询

author（作者）

使用：<meta name="author" content="TG, TG@qq.com" />
作用：标注网页的作者

copyright（版权）

使用：<meta name="copyright" content="本网站版权归TG所有"/>
作用：标注版权

generator

使用：<meta name="generator" content="所用的编辑器" />
作用：说明网站采用什么编辑器制作。

revisit-after（重访）

作用：网站重访
使用：<meta name="revisit-after" content="7days"/>

http-equiv

http-equiv类似于HTTP的头部协议，它回应给浏览器一些有用的信息，以帮助正确的精确的显示网页内容。与之对应的属性值为content,content中的内容就是各个参数的变量值。

语法

<meta http-equit="参数" content="参数值" />

属性

expires（期限）

作用：指定网页在缓存中的过期时间。一旦网页过期，必须到服务器上重新传输
使用：<meta http-equiv="expires" content="Wed, 26 Feb 1997 08:21:57 GMT"/>
注意：必须使用GMT的时间格式，或者直接设为0（数字表示多久后过期）

Pragma（chche模式）

作用：禁止浏览器从本地计算机的缓存中访问页面内容
使用：<meta http-equiv="Pragma" content="no-cache"/>

Refresh（刷新）

作用：自动刷新并指向新页面
使用：<meta http-equiv="refresh"content="5; url=http://www.baidu.com/" />
5表示5秒后自动刷新，并跳转到指定的URL路径中

window-target（显示窗口的设定）

作用：强制页面在当前窗口以独立页面显示
使用：<meta http-equiv="window-target" content="_top">
可以防止别人在框架里调用你的页面

content-type（显示字符集的设定）

作用：设置页面使用的字符集
使用：<meta http-equiv="content-Type" content="text/html;charset=utf-8"/>

Content-Language（显示语言的设定）

作用：显示语言
使用：<meta http-equiv="Content-Language" content="zh-cn" />

HTML新增属性值

name

viewport

作用：能优化移动浏览器的显示(屏幕的缩放)
使用：<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no"/>
参数值：

width viewport的宽度[device-width | pixel_value]width如果直接设置pixel_value数值，大部分的安卓手机不支持，但是ios支持；
height-viewport 的高度（范围从 223 到 10,000 ）
user-scalable [yes | no]是否允许缩放
initial-scale [数值] 初始化比例（范围从 > 0 到 10）
minimum-scale [数值] 允许缩放的最小比例
maximum-scale [数值] 允许缩放的最大比例

apple-mobile-web-app-capable

作用：启动WebApp全屏模式
使用：<meta name="apple-mobile-web-app-capable" content="yes" />