meta标签在我们写网页的过程中经常会被忽视，但是它里面包含的很多属性内容在很多时候都是至关重要的，因此我们还是需要好好了解一下meta是什么？它有哪些用法？
meta标签是什么？
meta标签可以用来定义文档的各种元数据。它有多种不同用法，而且一个HTML文档中可以有多个meta标签。
| 说明 | 解释 |
|---|---|
| 元素 | meta |
| 元素类型 | 元数据 |
| 允许具有的父元素 | head |
| 局部属性 | name，content，http-equiv，charset |
| 内容 | 无 |
| 标签用法 | 虚元素形式 |
| 是否为HTML5新增 | 否 |
| 在HTML5中的变化 | charset是HTML5中新增的；在HTML4中，http-equiv可以为任意多个不同值，而在HTML5中只有以下提到的值才能使用；HTML4中的scheme属性废除；不再使用meta元素来指定网页所用的语言 |
| 习惯样式 | 无 |
meta标签的用法
meta标签是放在head标签中的，主要有以下几种用法，每一种meta元素只能用于一种用途，如果需要使用多个特性，则需要在head标签中添加多个meta元素。
指定名/值元数据对
指定名/值元数据对需要用到name和content属性。用name表示元数据的名称，content属性表示值。
<meta name="author" content="yuanzi" />
常用的有以下几种值。
| 元数据名称 | 说明 |
|---|---|
| application name | 当前页所属web系统的名称 |
| author | 当前页的作者名 |
| description | 当前页的描述信息 |
| generator | 用来生成HTML的软件名称 |
| keywords | 描述页面的内容，字符串之间用逗号分隔 |
| viewport | 用于告诉搜索引擎，移动端的窗口，主要用于设计移动端网页。 |
| robots | 用来告诉爬虫哪些页面需要索引，哪些页面不需要索引。content的属性有all，none，noindex，follow，nofolllow. |
| copyright | 用于标注版权信息 |
| revisit-after | 如果网页不是经常更新，为了减轻搜索引擎爬虫对服务器的压力，可以设置一个爬虫的重访时间。如果重访时间过短，爬虫将按照它们定义的默认时间来访问。 |
| renderer | 为双核浏览器准备的，用于指定双核浏览器默认以何种方式渲染页面。 |
具体用例参考下面代码
<meta name="application name" content="后台系统">
<meta name="author" content="Lxxyx, 999999999@qq.com">
<meta name="description" content="热爱前端与编程，这是我的前端博客。"
<meta name="generator" content="Sublime Texts">
<meta name="keywords" content="博客，前端">
// 一般设置页面的自适应和缩放会用到
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="robots" content="none">
<meta name="copyright" content="Lxxyx">
<meta name="revisit-after" content="7 days">
<meta name="renderer" content="webkit">
除了上述这些值之外，还可以使用元数据扩展，具体可以参考这个网站，结合自己的需求进行扩展，这里就不展开说明了。
声明字符编码
meta标签的另一种用法就是声明文档内容所用的字符编码。我们一般采用的就是UTF-8。
<meta charset="utf-8" />
模拟http标头字段
meta标签的最后一种用途就是改写http标头字段的值，可以用来模拟或替换其中三种标头。
<meta http-equiv="refresh" content="5" />
其中http-equiv用来指定所要模拟的标头字段名称，字段值则由content属性指定。上述代码的意思是让浏览器每隔5秒就再次载入页面。
如果在刷新时间值后再加上一个分号再加上URL，那么浏览器就会每隔指定时间后就载入指定的URL。
http-equiv有以下三个content值
| 属性值 | 说明 |
|---|---|
| refresh | 以秒为单位指定一个时间间隔，在此时间过去之后将从服务器重新载入当前页面，也可以另行指定一个URL让浏览器载入。例如：'<meta http-equiv="refresh"content="5;www.baidu.com" />' |
| default-style | 指定页面优先使用的样式。content属性值应该与同一文档中某个style元素或link元素的title属性值相同 |
| content-type | 这是令一种声明HTML页面字符编码的方法。如：‘<meta http-equiv="content-type"content="text/html charset=UTF-8" />’ |
| X-UA-Compatible | 用于告知浏览器以何种版本来渲染页面（一般采用最新模式） |
| cache-control | 指定浏览器如何缓存某个响应以及缓存多长时间，或者 用于禁止当前页面在移动端浏览时，被百度自动转码 |
| expires | 用于设定网页的到期时间，过期后网页必须到服务器上重新传输。 |
| Set-Cookie | 如果网页过期。那个这个网页存在本地的cookie也会自动删除。 |
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> // 指定IE和chrome浏览器使用最新版本渲染页面
<meta http-equiv="cache-control" content="no-cache" />
/** 缓存时间的属性值有以下几种情况
属性值有以下几种情况：
* 1. no-cache: 先发送请求，与服务器确认资源是否被更改，如果未被更改，则使用缓存。
* 2. no-store: 不允许缓存，每次都要去服务器上，下载完整的响应。（安全措施）
* 3. public: 缓存所有响应，但并非必须。因为max-age也可以做到相同效果
* 4. private: 只为单个用户缓存，因此不允许任何中继进行缓存。（比如说CDN就不允许缓存private的响应）
* 5. maxage：表示当前请求开始，该响应在多久内能被缓存和重用，而不去服务器重新请求。例如：max-age=60表示响应可以再缓存和重用60秒。
*/
<meta http-equiv="Cache-Control" content="no-siteapp" />
<meta http-equiv="expires" content="Sunday 26 October 2016 01:00 GMT" />
<meta http-equiv="refresh" content="2; URL=http://www.lxxyx.win/">
<meta http-equiv="Set-Cookie" content="User=Lxxyx; path=/; expires=Sunday, 10-Jan-16 10:00:00 GMT">
