meta标签是html文档头部的一个标签，meta在计算机中是元的意思，w3shcool中称之为metadata，也就是元数据，当然，是描述网页的元数据，这个标签不是给用户看的，是给搜索引擎看的，说白了就是为了SEO。meta标签关键点在于它的属性，这些属性很繁琐，容易混淆，现将其用法做一个小小的总结，以供后来参考。
meta标签的属性用法分成两大类（charset属性只有一个固定用法，暂不列入2大类之中），分别是:
1. <meta name = "XXX" content = "xxxxx" />，这种用法的核心是属性name，其值是可变的，但是都有固定选项，不能随意乱写，我们下边会一一分析列举
2. <meta http-equiv = "xxxxx" content = "xxxxx" /> 这种用法的核心是属性http-equiv，其值是可变的，但是都有固定选项，不能随意乱写，我们下边会一一分析列举
一、首先来看 使用name属性的用法
name属性主要用于描述网页，比如网页的关键词，叙述等。与之对应的属性值为content，content中的内容是对name填入类型的具体描述，便于搜索引擎抓取。name属性常见的值有：
1.1 title
title作为name属性的值，其作用与<title>标签的作用是一样的，一般用的较少，更多的是直接使用<title></title>标签。能见到使用此值的网站比如优酷
<meta name="title" content="优酷-这世界很酷" />
1.2 keywords
顾名思义，描述网站的关键字，大家都会用它，比如：
优酷的： <meta name="keywords" content="视频,视频分享,视频搜索,视频播放" /> 京东的： <meta name="Keywords" content="网上购物,网上商城,手机,笔记本,电脑,MP3,CD,VCD,DV,相机,数码,配件,手表,存储卡,京东" />
1.3 description
对于网站功能，主要内容的描述性信息，比如：
京东的： <meta name="description" content="京东JD.COM-专业的综合网上购物商城,销售家电、数码通讯、电脑、家居百货、服装服饰、母婴、图书、食品等数万个品牌优质商品.便捷、诚信的服务，
为您提供愉悦的网上购物体验!" />
1.4 viewport
视口，用来做移动端网页适配的。这个可以作为学习移动web开发时再详细了解。最常见的用法如下：
<meta name="viewport" content="width=device-width, initial-scale=1">
1.5 robots
robots用来告诉爬虫哪些页面需要索引，哪些页面不需要索引。当name属性为“robots”的时候，content的参数有all,none,index,noindex,follow,nofollow。默认是all。
1.6 author
描述网页开发者信息，例如：
<meta name = "author" content = "barteam" />
1.7 generator
描述网页的开发工具，一般使用的较少
1.8 copyright
描述版权信息，比如：
起点中文网的： <meta name="copyright" content="本页版权 www.qidian.com 起点中文网所有。All Rights Reserved" />
其他不常见的属性就不再赘述了，想了解的可以在百度。
二、再来看http-equiv属性
它的值也有好多种可选项，把常用的也扒出来看看。
2.1 content-type
这个值是后台告诉浏览器，此次响应报文最基本的信息，非常关键，例如：
<meta http-equiv="content-Type" content="text/html; charset=utf-8">
这个例子中，meta标签告诉了浏览器2个重要信息，其一，告诉浏览器此次响应报文是一个纯文本文档，并且这个文档是html文档。其二，这个html文档的编码格式是utf-8 。
这个信息是非常关键的，如果响应报文是一个jpg图片，而响应头的meta标签写成如上的示例，那么这个图片就会被当做html纯文本文档来解释，结果是当然无法看到图片了。
2.2 X-UA-Compatible
IE8的专用标记，用来指定IE8浏览器去模拟某个特定版本的IE浏览器的渲染方式，以此来解决部分兼容问题。比如：
<meta http-equiv="X-UA-Compatible" content="IE=7">
以上代码告诉IE浏览器，无论是否用DTD声明文档标准，IE8/9都会以IE7引擎来渲染页面。
2.3 cache-control
告诉浏览器缓存机制，很少用。
<meta http-equiv="cache-control" content="no-cache">
当使用 cache-control时，content对应的值也很多，如下：
- Public：指示响应可被任何缓存区缓存。
- Private：指示对于单个用户的整个或部分响应消息，不能被共享缓存处理。这允许服务器仅仅描述当用户的部分响应消息，此响应消息对于其他用户的请求无效
- no-cache：指示请求或响应消息不能缓存
- no-store：用于防止重要的信息被无意的发布。在请求消息中发送将使得请求和响应消息都不使用缓存
- max-age：指示客户机可以接收生存期不大于指定时间（以秒为单位）的响应
- min-fresh：指示客户机可以接收响应时间小于当前时间加上指定时间的响应
- max-stale：指示客户机可以接收超出超时期间的响应消息。如果指定max-stale消息的值，那么客户机可以接收超出超时期指定值之内的响应消息
当然还有其他很多，这里不再一一列举了。
三、对于网页编码字符集的设置，现在更多的使用charset属性
比如：
<meta charset="UTF-8">
这是更推荐的设置字符集的用法。
好了，就总结到这里吧