META标签分两大部分：HTTP标题信息(http-equiv)和页面描述信息(name)。
http-equiv
http-equiv类似于HTTP的头部协议，它回应给浏览器一些有用的信息，以帮助正确和精确地显示网页内容。
- 设置页面编码 charset
UTF-8是世界性通用编码，也完美的支持中文编码
GB2312属于中文编码，针对国内用户使用，国外用户访问GB2312编码的网站就会变乱码。
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>设置字符编码</title>
</head>
<body>
</body>
</html></pre>
- 设置页面刷新时间 refresh
让网页多长时间自动刷新，或者多长时间后让网页自动链接到其他网页，单位：秒
不添加URL就本地刷新
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="refresh" content="3;url=https://www.baidu.com">
<title>刷新</title>
</head>
<body>
<p>设置网页3秒后跳转百度页面</p>
</body>
</html></pre>
- 设置网页缓存时间 expires
设置网页在缓存时间过期时间，一旦网页过期，就需要在服务器上重新加载
必须使用GMT的时间格式（格林尼治标准时间），或者直接设为0，数字表示多少时间后过期
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv=expires content=Thu,15 Apr 2010 20:00:00 GMT>
<title>缓存</title>
</head>
<body>
<p>Thu,15 Apr 2010 20:00:00 GMT;
他告诉浏览器缓存有效性持续到2010年4月15日为止，在这个时间之内相同的请求使用缓存，这个时间之外使用http请求。</p>
</body>
</html></pre>
- 禁止页面缓存 pragma（cach模式）
禁止浏览器从本地的缓存中调阅页面的内容
网页不保存在缓存中，每次访问都刷新页面，访问者无法脱机浏览
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="pragma" content="no-cach">
<title>禁止缓存</title>
</head>
<body>
</body>
</html></pre>
- Set-Cookie (cookie设定)
浏览器访问某个页面时会将它存在缓存中，下次再次访问时就可从缓存中读取，以提高速度。当你希望访问者每次都刷新你广告的图标，或每次都刷新你的计数器，就要禁用缓存了。通常HTML文件没有必要禁用缓存，对于ASP等页面，就可以使用禁用缓存，因为每次看到的页面都是在服务器动态生成的，缓存就失去意义。如果网页过期，那么存盘的cookie将被删除。
注意：必须使用GMT的时间格式。
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<Meta http-equiv=Set-Cookie Content=cookievalue=xxx; expires=Wednesday,21-Oct-98 16:14:21 GMT; path= />
<title>Set-Cookie</title>
</head>
<body>
</body>
</html></pre>
- Window-target (显示窗口的设定)
强制页面在当前窗口以独立页面显示。
这个属性是用来防止别人在框架里调用你的页面。
<caption style="margin: 0px; padding: 0px;">Content选项：</caption>
| _blank | 在新窗口中打开被链接的文档 |
| _self | 默认。在相同的框架中打开被链接的文档 |
| _top | 在整个窗口中打开被链接的文档 |
| _parent | 在父框架集中打开被链接文档 |
| framname | 在指定框架中打开被链接的文档 |
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv=widow-target Content=_top>
<title>显示窗口设定</title>
</head>
<body>
</body>
</html></pre>
NAME变量
name是描述网页的，对应于content（网页内容），以便于搜索引擎机器人查找、分类（目前几乎所有的搜索引擎都使用网上机器人自动查找meta值来给网页分类）。
name的value值（name=）指定所提供信息的类型。有些值是已经定义好的。例如description(说明)、keyword(关键字)、refresh(刷新)等。还可以指定其他任意值，如：creationdate(创建日期) 、
document ID(文档编号)和level(等级)等。
name的content指定实际内容。如：如果指定level(等级)为value(值)，则Content可能是beginner(初级)、intermediate(中级)、advanced(高级)。
- Keywords (关键字)
说明：为搜索引擎提供的关键字列表
用法：<Meta name=Keywords Content=关键词1,关键词2，关键词3,关键词4,……>
各关键词间用英文逗号“,”隔开。META的通常用处是指定搜索引擎用来提高搜索质量的关键词。当数个META元素提供文档语言从属信息时，搜索引擎会使用lang特性来过滤并通过用户的语言优先参照来显示搜索结果。
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name=kyewords lang=en content=关键字,关键字,关键字>
<title>网页关键字</title>
</head>
<body>
</body>
</html></pre>
- Description (简介)
Description用来告诉搜索引擎你的网站主要内容。
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name=description content=你网页的简述>
<title>网页的简述</title>
</head>
<body>
</body>
</html></pre>
- Robots (机器人向导)
Robots用来告诉搜索机器人哪些页面需要索引，哪些页面不需要索引。
许多搜索引擎都通过放出robot/spider搜索来登录网站，这些robot/spider就要用到meta元素的一些特性来决定怎样登录。
<caption style="margin: 0px; padding: 0px;">Content的参数</caption>
|
all
| 文件将被检索，且页面上的链接可以被查询； |
|
none
| 文件将不被检索，且页面上的链接不可以被查询；(和 noindex, no follow 起相同作用) |
|
index
| 文件将被检索；（让robot/spider登录） |
|
follow
| 页面上的链接可以被查询； |
|
noindex
| 文件将不被检索，但页面上的链接可以被查询；(不让robot/spider登录) |
| nofollow | 文件将不被检索，页面上的链接可以被查询。(不让robot/spider顺着此页的连接往下探找) |
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name=robots content=all>
<title>Robots</title>
</head>
<body>
</body>
</html></pre>
- Author (作者)
标注网页的作者或制作组
Content可以是：你或你的制作组的名字,或Email
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name=author content=修抗,www.1778895866@qq.com>
<title>网页的作者</title>
</head>
<body>
</body>
</html></pre>
- Copyright (版权)
标注版权
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px !important;"><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name=copyright content=本页版权归修抗个人所有。All Rights Reserved>
<title>网页的版权</title>
</head>
<body>
</body>
</html></pre>
- 6、Generator (编辑器)
编辑器的说明
Content=你所用编辑器
<pre style="margin: 0px; padding: 0px; white-space: pre-wrap; overflow-wrap: break-word; font-family: "Courier New" !important; font-size: 12px; color: rgb(0, 0, 0); font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-style: initial; text-decoration-color: initial;"><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name=generator content=sublime>
<title>编写网页使用的编辑器</title>
</head>
<body>
</body>
</html></pre>
