描述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（机器人向导）
使用：<meta name="robots" content="all | none | index | noindex | follow | nofollow" />
作用：robots告诉搜索引擎哪些页面需要索引，那些页面不需要索引
参数讲解：参数默认为all。
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" />
————————————————
版权声明：本文为CSDN博主「庸人°」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/wuxian_wj/article/details/122377019
