HTML5——meta标签总结

< meta >标签属性总结:

< meta > 元素必须包含在 < head > 元素中并且在HTML代码的前1024个字节内,因为某些浏览器在选择编码之前只查看前面这些字节。

1、charset属性:

  • 此属性声明当前文档所使用的字符编码,鼓励使用 UTF-8;但该声明可以被任何一个元素的 lang 特性的值覆盖。

2、 name属性:

  • name属性主要用于描述网页,比如网页的关键词,叙述等。与之对应的属性值为content,content中的内容是对name填入类型的具体描述,便于搜索引擎抓取。
  • meta标签中name属性语法格式是:
    <meta name="参数" content="具体的描述">.

其中name属性共有以下几种参数:

A. keywords(关键字)

  说明:用于告诉搜索引擎,你网页的关键字,关键字以逗号分隔。
  <meta name="keywords" content="HTML5,前端,代码,样式">

B. description(网站内容的描述)

  说明:用于告诉搜索引擎,你网站的主要内容。
  <meta name="description" content="这是一张HTML5前端开发的教程页面">

C. viewport(移动端的窗口)

  说明:这个属性常用于设计移动端网页。
  <meta name="viewport" content="width=device-width, initial-scale=1">

D. robots(定义搜索引擎爬虫的索引方式)

  说明:robots用来告诉爬虫哪些页面需要索引,哪些页面不需要索引;content的参数有all,none,index,noindex,follow,nofollow。默认是all。
  <meta name="robots" content="none"> //不希望页面被抓取并公开,若想要页面被搜索为all;
具体参数如下:
1.none : 搜索引擎将忽略此网页,等价于noindex,nofollow。
2.noindex : 搜索引擎不索引此网页。
3.nofollow: 搜索引擎不继续通过此网页的链接索引搜索其它的网页。
4.all : 搜索引擎将索引此网页与继续通过此网页的链接索引,等价于index,follow。
5.index : 搜索引擎索引此网页。
6.follow : 搜索引擎继续通过此网页的链接索引搜索其它的网页。

E. author(作者)

  说明:用于标注网页作者.
  <meta name="author" content="your information">

F.format-detection(格式检测)

说明:主要对移动端网页一些链接进行检测识别。主要有一下几种:
1,将数字显示为拨号链接:
  <meta name="format-detection" content="telephone=no">
  telephone = no 禁止把数字转为拨号链接;
  telephone = yes 开启数字转拨号链接,默认是开启的,可以不用写。
2,对邮箱的自动识别:
  <meta name="format-detection" content="email=no">
  email = no 禁止作为邮箱地址。
  email = yes 看做邮箱地址,默认下开启。
3,跳转地图:
  <<meta name="format-detection" content="adress=no">
  adress=no禁止跳转至地图!
  adress=yes就开启了点击地址直接跳转至地图的功能,在默认是情况下就是开启!
这几种格式设置可以连着写:<meta name="format-detection" content="telephone=no,email=no,adress=no">

G.HandheldFriendly(支持设备老化)

  <meta> name = "HandheldFriendly" content = "true">

3、http-equiv属性

http-equiv参数如下

A.refresh(刷新)

  说明:自动刷新并指向新页面。
  <meta http-equiv="Refresh" content=" 2;URL=http://www.net.cn/">
  其中:2 是停留两秒后刷新。

B.expires(期限)

  说明:可以用于设定网页的到期时间。一旦网页过期,必须到服务器上重新传输。时间必须使用GMT格式。
  <meta http-equiv="expires" content="Wed, 20 Jun 2007 22:33:00 GMT">

C.set-cookie(cookie设定)

  说明:如果网页过期,那么存盘的cookie将被删除。
  <meta http-equiv="Set-Cookie" content="cookievalue=xxx;expires=Wednesday, 20-Jun-2007 22:33:00 GMT; path=/">

D.content-Type(显示字符集的设定)

  说明:设定页面使用的字符集。
  <meta http-equiv="content-Type" content="text/html; charset=gb2312">

E.page_enter、page_exit

  设定进入页面时的特殊效果:
  <meta http-equiv="Page-Enter" contect="revealTrans(duration=1.0,transtion= 12)">
设定离开页面时的特殊效果:
  <meta http-equiv="Page-Exit" contect="revealTrans(duration=1.0,transtion= 12)">
  Duration的值为网页动态过渡的时间,单位为秒。
  Transition是过渡方式,它的值为0到23,分别对应24种过渡方式。如下表:

0    盒状收缩   				           1    盒状放射  
2    圆形收缩   				           3    圆形放射  
4    由下往上  				           5    由上往下  
6    从左至右    					   7    从右至左  
8    垂直百叶窗   				       9    水平百叶窗  
10    水平格状百叶窗    			       11   垂直格状百叶窗  
12    随意溶解    			           13	从左右两端向中间展开  
14	 从中间向左右两端展开   	           15   从上下两端向中间展开  
16 	从中间向上下两端展开                 17    从右上角向左下角展开  
18    从右下角向左上角展开               19    从左上角向右下角展开  
20    从左下角向右上角展开               21    水平线状展开  
22    垂直线状展开  			           23    随机产生一种过渡方式
F.window-target(显示窗口的设定)

  说明:强制页面在当前窗口以独立页面显示。
  <meta http-equiv="Window-target" content="_top">

相关推荐
©️2020 CSDN 皮肤主题: 数字20 设计师:CSDN官方博客 返回首页