前言
作为前端开发，对于meta标签的了解还是很有必要的。本次分享属于科普类型的，涉及内容不会太深。大佬请掠过哈。
首先在html中有很多标签，meta只是其中的一种而已，但是meta标签的作用是有些不一样的。标签用来提供有关html文档的元数据,元数据不会显示给用户看,但浏览器可以识别,同时对SEO(搜索引擎优化)起着重要作用
常用的meta标签列举
<1>author 用来表示网页的作者的名字，例如某个组织或者机构。
<meta name="author" content="aaa@mail.abc.com">
<2>description 是一段简短而精确的、对页面内容的描述
<meta name="description"
content="全球领先的中文搜索引擎">
<3>keywords 与页面内容相关的关键词，使用逗号分隔。某些搜索引擎在遇到这些关键字时，会用这些关键字对文档进行分类
<meta name="keywords" content="酱酒定制、酱酒品牌服务、酱酒产业互联网、一物一码、酱酒数字营销、酱酒新零售">
<4>viewport 为 viewport（视口）的初始大小提供指示。目前仅用于移动设备
<meta name="viewport" content="width=device-width, initial-scale=1.0"> width用来设置 viewport 的宽度为设备宽度; initial-scale为设备宽度与 viewport 大小之间的缩放比例。
<5>robots 表示爬虫对此页面的处理行为，或者说，应当遵守的规则，是用来做搜索引擎抓取的。
<meta name="robots" content="all"> all:搜索引擎可以抓取本页面，也可以通过本页面中的链接抓取其他页面 none:搜索引擎不能抓取本页面，也不能通过本页面中的链接抓取其他页面 index:搜索引擎可以抓取本页面 noindex:搜索引擎不能抓取本页面,但可以通过本页面中的链接抓取其他页面 follow:搜索引擎可以通过本页面的链接抓取其他页面 nofollow:禁止搜索引擎通过本页面中的链接抓取其他页面
<6>renderer(渲染器) 用来指定双核浏览器的渲染方式，比如360浏览器
<meta name="renderer" content="webkit"> //默认webkit内核 <meta name="renderer" content="ie-comp"> //默认IE兼容模式 <meta name="renderer" content="ie-stand"> //默认IE标准模式
<7>X-UA-Compatible 它是用来是做IE浏览器适配的。
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> IE=edge告诉浏览器，以当前浏览器支持的最新版本来渲染，IE9就以IE9版本来渲染。 chrome=1告诉浏览器，如果当前IE浏览器安装了Google Chrome Frame插件，就以chrome内核来渲染页面。
<8>content-type
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"> 用来声明文档类型和字符集
<9>x-dns-prefetch-control (dns预解析)
<meta http-equiv="x-dns-prefetch-control" content="on"> 一般来说，HTML页面中的a标签会自动启用DNS提前解析来提升网站性能，但是在使用https协议的网站中失效了，我们可以用这个来打开dns对a标签的提前解析
<10>referrer (请求来源)
<meta name="referer" content="no-referer">
meta标签中name=referrer属性主要用于控制客户端发送给服务端的referrer信息，告诉服务端一些客户端的信息，如：来源网页的地址。
never：删除http head中的referer；
origin：只发送origin部分；
always：不改变http header中的referer的值；
【最后注意】 cache-control、Pragma、Expires和缓存相关的设置，但是遗憾的是这些往往不生效，我们一般都通过http headers来设置缓存策略
更多学习视频学习资料请参考：B站搜索“我们一起学前端”
