HTML meta标签的介绍

1. <meta name="keywords" content="关键字">

content里面写网页的关键字，可以写多个，用逗号隔开。

2. <meta name="description" content="网站的介绍">

content里面写关于网站的介绍描述

3. <meta name="robots" content="all">

这个是用来定义搜索爬虫的方式，这里的content的属性有:all,none,index,noindex,follow,nofollow，默认是‘all’，

all：文件将被检索，且页面上的链接可以被查询；none：跟all相反；index：文件将被检索；noindex：文件将不被检索，但是页面上的链接可以被找到；follow：网页上的链接可以被找到；nofollow：网页可以搜索到，但是网页上的链接不可以被找到

4. <meta name="author" content="作者">

content里面可以写网站作者的相关资料如名字，邮箱，QQ什么的

5. <meta name="copyright" content="版权信息">

这里写版权信息相关的东西

6. <meta charset="UTF-8" />

网页的编码格式：

UTF-8:世界通用的编码格式

GB2312：简体中文

其他的网上可以找到

7. <meta http-equiv="Refresh" content="3;url=http://www.mackxin.com">

网页在3秒后自动跳转到www.mackxin.com这个网站上，如果不写右边的网址，表示3秒后刷新当前网页

如果你也有好的想法，可以关注我的微信公众号：馨客栈，也可以加入我的新的QQ群：65202496来一起交流学习好玩有趣的想法。进群可以也拉到微信群一起交流各种有趣好玩的分享

eta常用于定义页面的说明，关键字，最后修改日期，和其它的元数据。这些元数据将服务于浏览器（如何布局或重载页面），搜索引擎和其它网络服务。

meta标签分两大部分：HTTP标题信息(http-equiv)和页面描述信息(name)。

一、http-equiv 属性

http-equiv一般设置的都是与http请求头相关的信息，设置的值会关联到http头部。也就是说浏览器在请求服务器获取html的时候，服务器会将html中设置的meta放在响应头中返回给浏览器。常见的类型比如content-type, expires, refresh, set-cookie, window-target, charset， pragma等等。

1. content-type

比如：<meta http-equiv="content-type" content="text/html charset=utf8">可以用来声明文档类型，设置字符集，content-type几乎所有的属性都可以在meta中进行设置。

这样设置浏览器的头信息就会包含:

content-type: text/html charset=utf8

2. expires

用于设置浏览器的过期时间, 其实就是响应头中的expires属性。

<meta http-equiv="expires" content="31 Dec 2021">

expires:31 Dec 2008

3. refresh

该种设定表示5秒自动刷新并且跳转到指定的网页。如果不设置url的值那么浏览器则刷新本网页。

<meta http-equiv="refresh" content="5 url=http://www.zhiqianduan.com">

4. window-target

强制页面在当前窗口以独立页面显示, 可以防止别人在框架中调用自己的页面。

<meta http-equiv="window-target" content="_top'>

5. pragma

禁止浏览器从本地计算机的缓存中访问页面的内容

<meta http-equiv="pragma" content="no-cache">

二、name 属性

name属性主要用于描述网页，与对应的content中的内容主要是便于搜索引擎查找信息和分类信息用的, 用法与http-equiv相同，name设置属性名，content设置属性值。

1. author

author用来标注网页的作者

<meta name="author" content="aaa@mail.abc.com">

2. description

description用来告诉搜素引擎当前网页的主要内容，是关于网站的一段描述信息。

<meta name="description" content="这是我的HTML">

3. keywords

keywords设置网页的关键字，来告诉浏览器关键字是什么。是一个经常被用到的名称。它为文档定义了一组关键字。某些搜索引擎在遇到这些关键字时，会用这些关键字对文档进行分类。

<meta name="keywords" content="Hello world">

4. generator

表示当前html是用什么工具编写生成的，并没有实际作用，一般是编辑器自动创建的。

<meta name="generator" content="vscode">

5. revised

指定页面的最新版本

<meta name="revised" content="V2，2015/10/1">

6. robots

告诉搜索引擎机器人抓取哪些页面，all / none / index / noindex / follow / nofollow。

<meta name="robots" content="all">

all：文件将被检索，且页面上的链接可以被查询；none：文件将不被检索，且页面上的链接不可以被查询；index：文件将被检索；follow：页面上的链接可以被查询；noindex：文件将不被检索，但页面上的链接可以被查询；nofollow：文件将不被检索，页面上的链接可以被查询。

eta标签

name属性

meta标签的name属性语法格式是：

name属性参数：　

keywords用来告诉搜索引擎你网页的关键字是什么。

举例：<meta name="keywords"content="meta总结,html meta,meta属性,meta跳转">

description用来告诉搜索引擎你的网站主要内容。

举例：<meta name="description"content="haorooms博客,html的meta总结，meta是html语言head区的一个辅助性标签。">

robots用来告诉搜索机器人哪些页面需要索引，哪些页面不需要索引。

content的参数有all,none,index,noindex,follow,nofollow。默认是all。

举例：<meta name="robots"content="none">

具体参数如下：

信息参数为all：文件将被检索，且页面上的链接可以被查询；

信息参数为none：文件将不被检索，且页面上的链接不可以被查询；

信息参数为index：文件将被检索；

信息参数为follow：页面上的链接可以被查询；

信息参数为noindex：文件将不被检索，但页面上的链接可以被查询；

信息参数为nofollow：文件将被检索，但页面上的链接不可以被查询；

author标注网页作者

举例：<meta name="author"content="root,root@xxxx.com">

generator

meta标签的generator的信息参数，代表说明网站的采用的什么软件制作。

COPYRIGHT

meta标签的COPYRIGHT的信息参数，代表说明网站版权信息。

revisit-after

revisit-after代表网站重访,7days代表7天，依此类推。

移动设备

WebApp全屏模式

隐藏状态栏/设置状态栏颜色

添加到主屏后的标题

忽略数字自动识别为电话号码

忽略识别邮箱

浏览器不会自动调整文件的大小,也就是说是固定大小,不会随着浏览器拉伸缩放。

谢谢关注！

在线咨询

上一篇：JavaScript实现表单验证
下一篇：手把手教你写一个简易的微前端框架

您的项目需求

*请认真填写需求信息，我们会在24小时内与您取得联系。

整合营销服务商