META标签分两大部分:HTTP标题信息(http-equiv)和页面描述信息(name)。
http-equiv
http-equiv类似于HTTP的头部协议,它回应给浏览器一些有用的信息,以帮助正确和精确地显示网页内容。
  • 设置页面编码 charset

UTF-8是世界性通用编码,也完美的支持中文编码

GB2312属于中文编码,针对国内用户使用,国外用户访问GB2312编码的网站就会变乱码。

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>设置字符编码</title>
</head>
<body> </body>
</html>
  • 设置页面刷新时间 refresh

让网页多长时间自动刷新,或者多长时间后让网页自动链接到其他网页,单位:秒

不添加URL就本地刷新

<!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>
  • 设置网页缓存时间  expires

设置网页在缓存时间过期时间,一旦网页过期,就需要在服务器上重新加载

必须使用GMT的时间格式(格林尼治标准时间),或者直接设为0,数字表示多少时间后过期

<!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>
  • 禁止页面缓存 pragma(cach模式)

禁止浏览器从本地的缓存中调阅页面的内容

网页不保存在缓存中,每次访问都刷新页面,访问者无法脱机浏览

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="pragma" content="no-cach">
<title>禁止缓存</title>
</head>
<body> </body>
</html>
  • Set-Cookie (cookie设定)
浏览器访问某个页面时会将它存在缓存中,下次再次访问时就可从缓存中读取,以提高速度。当你希望访问者每次都刷新你广告的图标,或每次都刷新你的计数器,就要禁用缓存了。通常HTML文件没有必要禁用缓存,对于ASP等页面,就可以使用禁用缓存,因为每次看到的页面都是在服务器动态生成的,缓存就失去意义。如果网页过期,那么存盘的cookie将被删除。
注意:必须使用GMT的时间格式。 
<!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>
  • Window-target (显示窗口的设定)
强制页面在当前窗口以独立页面显示。
这个属性是用来防止别人在框架里调用你的页面。
 
Content选项:
_blank 在新窗口中打开被链接的文档
_self 默认。在相同的框架中打开被链接的文档
_top 在整个窗口中打开被链接的文档
_parent 在父框架集中打开被链接文档
framname 在指定框架中打开被链接的文档
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv=widow-target Content=_top>
<title>显示窗口设定</title>
</head>
<body> </body>
</html>
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特性来过滤并通过用户的语言优先参照来显示搜索结果。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name=kyewords lang=en content=关键字,关键字,关键字>
<title>网页关键字</title>
</head>
<body> </body>
</html>
  • Description (简介)
Description用来告诉搜索引擎你的网站主要内容。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name=description content=你网页的简述>
<title>网页的简述</title>
</head>
<body> </body>
</html>
  • Robots (机器人向导)
Robots用来告诉搜索机器人哪些页面需要索引,哪些页面不需要索引。
许多搜索引擎都通过放出robot/spider搜索来登录网站,这些robot/spider就要用到meta元素的一些特性来决定怎样登录。
Content的参数

all
文件将被检索,且页面上的链接可以被查询;
none
文件将不被检索,且页面上的链接不可以被查询;(和 noindex, no follow 起相同作用)
index
文件将被检索;(让robot/spider登录)
follow
页面上的链接可以被查询;
noindex
文件将不被检索,但页面上的链接可以被查询;(不让robot/spider登录)
nofollow 文件将不被检索,页面上的链接可以被查询。(不让robot/spider顺着此页的连接往下探找)
 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name=robots content=all>
<title>Robots</title>
</head>
<body> </body>
</html>
  • Author (作者)
标注网页的作者或制作组
Content可以是:你或你的制作组的名字,或Email
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name=author content=修抗,www.1778895866@qq.com>
<title>网页的作者</title>
</head>
<body> </body>
</html>
  • Copyright (版权)
标注版权
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name=copyright content=本页版权归修抗个人所有。All Rights Reserved>
<title>网页的版权</title>
</head>
<body> </body>
</html>
  • 6、Generator (编辑器)
编辑器的说明
Content=你所用编辑器
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name=generator content=sublime>
<title>编写网页使用的编辑器</title>
</head>
<body> </body>
</html>

HTML mate标签的更多相关文章

  1. <mate>标签中属性/值的各个意思

    <mate>标签中属性/值的各个意思 HTML 4 name 属性 1.<mate name="author" content="" /> ...

  2. rem的在vue项目中使用配置,,浏览器的兼容性之Mate标签

    在vue中配置rem 位置:在APP.vue的script中,在export default之外 (()=>{ let winW = document.documentElement.clien ...

  3. Html mate标签的常见功能

    一.常用的功能 1.禁止屏幕缩放 <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, us ...

  4. mate标签

    <meta charset='utf-8'> <!-- 优先使用 IE 最新版本和 Chrome -->    <meta http-equiv="X-UA-C ...

  5. 最近一年多我总结的常用mate标签-常用mate标签

    昨天开始上班  ,今天晚上不是太忙 ,来写篇博客了 meta元素共有三个可选属性(http-equiv.name和scheme)和一个必选属性(content),content定义与 http-equ ...

  6. 最近我总结的常用mate标签-常用mate标签

    昨天开始上班  ,今天晚上不是太忙 ,来写篇博客了 meta元素共有三个可选属性(http-equiv.name和scheme)和一个必选属性(content),content定义与 http-equ ...

  7. mate 标签的 http-equiv

    http-equiv 1. 页面的描述 <meta http-equiv="description" content="This is my page"& ...

  8. 移动端mate标签设置

    <meta name="viewport" content="width=device-width,height=device-height,initial-sca ...

  9. HTML <meta> 标签,搜索引擎

    关于Mate标签的详尽解释,请查看w3school 网址为:http://www.w3school.com.cn/tags/tag_meta.asp meta标签作用 META标签是HTML标记HEA ...

随机推荐

  1. 20165230 学习基础和C语言基础调查

    20165230 学习基础和C语言基础调查 技能学习经验 我擅长弹钢琴.小时候我曾上过很多兴趣班,比如钢琴.跳舞.书法.绘画等等,唯一坚持至今的只有钢琴.仔细一算学习钢琴至今已有12年,不能说已经精通 ...

  2. 第一迭代目标——future weather

    第一个迭代目标(主要数据) 引导界面.获取天气数据(api接口).天气分享 人员工作分配: 引导界面:周子静,界面的引导,耗时3天 获取天气数据:包舒婷.俞先浩,api接口,耗时5天 天气分享:郭磊蕾 ...

  3. 关于ASP.NET MVC的js和css资源管理

    本文来源于博客园-钱智慧,转载请注明出处 通过这篇文章和这个回答,我们总结如下: 浏览器针对一个域名,最多只会开启6个线程来加载文件,比如head中如果有7个引入文件(js文件或者css文件)的标签, ...

  4. 关于try catch finally

    一.try catch finally的初步理解 首先,我们什么时候要用到try/catch和finally? --已知执行的代码有可能有异常的情况下 try { //这里执行的代码如果出现异常,则立 ...

  5. c++ --> 变量、常量与运算符

    变量.常量与运算符   一.什么是变量?    在计算机的内存中, 内存被划分为一个一个的内存单元, 每个内存单元有自己的编号, 而变量就是对某一段连续内存单元使用一些更容易记忆.更容易区分的字符组合 ...

  6. BigDecimal 转成 double

    NUMBER(20,2) 数据库里的字段number  ,实体是BigDecimal 将BigDecimal转成double public double getOrderamount() { if ( ...

  7. xilinx的quick boot(1) ——flash的一些内容

    xilinx的quick boot(1) --flash,quick boot配置文件,以及中间的一些联系xilinx 配置模式分为SPI,BPI.用过的spi外挂flash是N25Q./////// ...

  8. 数据库中插入数据时发生ora-00984错误

    操作Oracle数据库,插入数据时显示:ORA-00984列在此处不允许错误,如下图所示: 出现的原因是由于,在插入字符或字符串型字段时.如果插入的数据是纯数字,则不会有错误:如果出现字符,则会报OR ...

  9. Android中的layout_gravity和gravity的区别

    在Android的布局中,除了padding和margin容易弄混之外,还有layout_gravity和gravity.按照字面意思来说,layout_gravity就是相对于layout来设置的. ...

  10. [开源] yvm - 自制Java虚拟机

    项目地址 : https://github.com/racaljk/yvm 虚拟机现在已可运行(不过还有很多待发现待修复的bugs),已支持语言特性有: Java基本算术运算,流程控制语句,面向对象. ...