meta标签使用

一、定义

1、meta标签是用来描述一盒HTML网页文档的属性,例如作者、时间、网页描述、关键词、页面刷新等
2、meta标签位于文档的头部,不包含任何内容
3、meta标签的属性定义了与文档相关联的名称/值对,是一个辅助标签
4、示例:

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="keywords" content="关键词" />
    <meta name="description" content="描述" />
</head>

5、组成
meta标签共有两个属性,它们分别是http-equiv属性和name属性,不同的属性又有不同的参数值

二、name属性

1、Keywords(关键字)
说明:向搜索引擎说明你网页的关键词
用法:<meta name ="keywords" content="紫沐兜,经验分享">
2、description(网站内容描述)
说明:向搜索引擎说明你网站的主要内容
用法:<meta name ="description" content="紫沐兜,经验分享">
3、author(作者)
说明:告诉搜索引擎你网站的作者,网页版权信息
用法:<meta name="author" contect="你的姓名">
4、Robots(机器人向导)
说明:用来告诉搜索引擎机器人抓取哪些页面
Robots属性说明如下:

  • all:文件将被检索,且页面上的链接可以被查询
  • none:文件将不被检索,且页面上的链接不可以被查询
  • index:文件将被检索
  • follow:页面上的链接可以被查询
  • noindex:文件将不被检索,但页面上的链接可以被查询
  • nofollow:文件将不被检索,页面上的链接可以被查询

用法:<meta name="robots" content="none">

5、generator
说明:用以说明网站是什么软件制作的
用法:<meta name="generator" content="eclipse" />

三、http-equiv属性

1、Expires(期限)
说明:用于设定网页的到期时间。一旦网页过期,必须到服务器上重新传输
用法:<meta http-equiv="expires" content="Fri,12 Jan 2001 18:18:18 GMT">
注意:必须使用GMT的时间格式
2、Pragma(cache模式)
说明:禁止浏览器从本地计算机的缓存中访问页面内容
用法:<meta http-equiv="Pragma" content="no-cache">
注意:这样设定,访问者将无法脱机浏览
3、Refresh(刷新)
说明:自动刷新并指向新页面
用法:<meta http-equiv="Refresh" content="2;URL"> (注意后面的引号,分别在秒数的前面和网址的后面)
注意:其中的2是指停留2秒钟后自动刷新到URL网址
4、Set-Cookie(cookie设定)
说明:如果网页过期,那么存盘的cookie将被删除
用法:<meta http-equiv="Set-Cookie" content="cookievalue=xxx; expires=Friday,12-Jan-2001 18:18:18 GMT; path=/">
注意:必须使用GMT的时间格式
5、Window-target(显示窗口的设定)
说明:强制页面在当前窗口以独立页面显示
用法:<meta http-equiv="Window-target" content="_top">
注意:用来防止别人在框架里调用自己的页面
6、content-Language(显示语言的设定)
说明:用以说明主页制作所使用的文字以及语言
用法:<meta http-equiv="Content-Language" content="zh-cn" />
解析:上面zh代表语言代码,cn代表国家版本,即primary-code为语言代码,subcode为国家代码这两部分组成
常见的语言代码:

  • zh (Chinese)中国
  • fr (French)法国
  • de (German)德国
  • it (Italian)意大利
  • nl (Dutch)荷兰
  • el (Greek)希腊
  • es (Spanish)西班牙
  • pt (Portuguese)葡萄牙
  • ar (Arabic)阿拉伯
  • ru (Russian)俄罗斯
  • ja (Japanese)日本

7、content-Type(显示字符集的设定)
说明:设定页面使用的字符集
用法:<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
常用字符编码:

  • GB2312:简体中文
  • BIG5:繁体中文
  • iso-2022-jp:日文
  • ks_c_5601:韩文
  • ISO-8859-1:英文
  • UTF-8:世界通用语言编码(最常用的)

四、示例总结

<head>
    <!-- 关键词 -->
    <meta name ="keywords" content="紫沐兜,经验分享">
    <!-- 描述 -->
    <meta name ="description" content="紫沐兜,经验分享">
    <!-- 描作者-->
    <meta name="author" contect="你的姓名">
    <!-- 制作工具-->
    <meta name="generator" content="eclipse" />
    <!-- 机器人向导-->
    <meta name="robots" content="none">
    <!-- 有效时间-->
    <meta http-equiv="expires" content="Fri,12 Jan 2001 18:18:18 GMT">
    <!-- 禁用缓存 -->
    <meta http-equiv="Pragma" content="no-cache">
    <!-- 2秒刷新-->
    <meta http-equiv="Refresh" content="2;URL">
    <!-- cookie设定 -->
    <meta http-equiv="Set-Cookie" content="cookievalue=xxx; expires=Friday,12-Jan-2001 18:18:18 GMT; path=/">
    <!-- 显示顶层窗口-->
    <meta http-equiv="Window-target" content="_top">
    <!-- UTF-8编码 -->
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!-- 中文-->
    <meta http-equiv="Content-Language" content="zh-cn" />
</head>