一直习惯的使用meta标签,还真么认真理解过,至少英文意思都还没弄明白。。。

下面是摘自网络的解释:

互动百科:

元素可提供相关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词。 标签位于文档的头部,不包含任何内容。 标签的属性定义了与文档相关联的名称/值对。例如加入关键字会自动被大型搜索网站自动搜集;可以设定页面格式及刷新等等。meta标签共有两个属性,它们分别是http-equiv属性和name属性,不同的属性又有不同的参数值,这些不同的参数值就实现了不同的网页功能。

name属性
name属性主要用于描述网页,与之对应的属性值为content,content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的。
meta标签的name属性语法格式是:<meta name="参数" content="具体的参数值">;。
其中name属性主要有以下几种参数:
A、Keywords(关键字)
说明:keywords用来告诉搜索引擎你网页的关键字是什么。
举例:<meta name ="keywords" content="science,education,culture,politics,ecnomics,relationships,entertainment,human">
B、description(网站内容描述)
说明:description用来告诉搜索引擎你的网站主要内容。
网站内容描述(description)的设计要点:
①网页描述为自然语言而不是罗列关键词(与keywords设计正好相反);
②尽可能准确地描述网页的核心内容,通常为网页内容的摘要信息,也就是希望搜索引擎在检索结果中展示的摘要信息;
③网页描述中含有有效关键词;
④网页描述内容与网页标题内容有高度相关性
⑤网页描述内容与网页主体内容有高度相关性;
⑥网页描述的文字不必太多,一般不超过搜索引擎检索结果摘要信息的最多字数(通常在100中文字之内,不同搜索引擎略有差异)。
举例:<meta name="description" content="This page is about the meaning of science,education,culture.">
C、robots(机器人向导)
说明:robots用来告诉搜索机器人哪些页面需要索引,哪些页面不需要索引。
content的参数有all,none,index,noindex,follow,nofollow。默认是all。
举例:<meta name="robots" content="none">
D、author(作者)
说明:标注网页的作者
http-equiv属性
http-equiv顾名思义,相当于http的文件头作用,它可以向浏览器传回一些有用的信息,以帮助正确和精确地显示网页内容,与之对应的属性值为content,content中的内容其实就是各个参数的变量值。
meta标签的http-equiv属性语法格式是:<meta http-equiv="参数" content="参数变量值"> ;其中http-equiv属性主要有以下几种参数:
A、Expires(期限)
说明:可以用于设定网页的到期时间。一旦网页过期,必须到服务器上重新传输。
用法:<meta http-equiv="expires" content="Fri,12 Jan 2001 18:18:18 GMT">
注意:必须使用GMT的时间格式
B、Pragma(cache模式)
说明:禁止浏览器从本地计算机的缓存中访问页面内容
用法:<meta http-equiv="Pragma" content="no-cache">
注意:这样设定,访问者将无法脱机浏览。
C、Refresh(刷新)
说明:自动刷新并指向新页面。
用法:<meta http-equiv="Refresh" content="2;URL">;(注意后面的引号,分别在秒数的前面和网址的后面)
注意:其中的2是指停留2秒钟后自动刷新到URL网址。
D、Set-Cookie(cookie设定)
说明:如果网页过期,那么存盘的cookie将被删除。
用法:<meta http-equiv="Set-Cookie" content="cookievalue=xxx; expires=Friday,12-Jan-2001 18:18:18 GMT; path=/">
注意:必须使用GMT的时间格式。
E、Window-target(显示窗口的设定)
说明:强制页面在当前窗口以独立页面显示。
用法:<meta http-equiv="Window-target" content="_top">
注意:用来防止别人在框架里调用自己的页面。
F、content-Type(显示字符集的设定)
说明:设定页面使用的字符集。
用法:<meta http-equiv="content-Type" content="text/html; charset=gb2312">
G、content-Language(显示语言的设定)
用法:<meta http-equiv="Content-Language" content="zh-cn" />

meta的动画效果

使用meta标签,我们还可以在进入网页或者离开网页的一刹那实现动画效果,我们只要在页面的html代码中的<head></head>;标签之间添加如下代码就可以了:
<meta http-equiv="Page-Enter" content="revealTrans(duration=5.0,transition=20)">
一旦上述代码被加到一个网页中后,我们再进出页面时就会看到一些特殊效果,这个功能其实与FrontPage2000中的Format/Page Transition一样,但我们要注意的是所加网页不能是一个Frame页; RevealTrans动态滤镜
Duration表示滤镜特效的持续时间(单位:秒)
Transition滤镜类型。表示使用哪种特效,取值为0-23:
0矩形缩小
1矩形扩大
2 圆形缩小
3 圆形扩大
4 下到上刷新
5 上到下刷新
6 左到右刷新
7 右到左刷新
8 竖百叶窗
9 横百叶窗
10 错位横百叶窗
11 错位竖百叶窗
12 点扩散
13 左右到中间刷新
14 中间到左右刷新
15 中间到上下
16 上下到中间
17 右下到左上
18 右上到左下
19 左上到右下
20 左下到右上
21 横条
22 竖条
23 以上22种随机选择一种

 

wiki

META

In computer science, a common prefix that means "about". So, for example, metadata is data that describes other data (data about data). A metalanguage is a language used to describe other languages. A metafile is a file that contains other files. The HTML META tag is used to describe the contents of a Web page.

在计算机科学中,一个常见的前缀,这意味着“about”。 例如,元数据是描述其它数据(有关数据的数据)。 一种元语言,是一种用来描述其他语言的语言。 图元文件是一个文件,其中包含其他文件。 HTML META标签是用来描述Web页面的内容。(有道翻译)

 

其他还有好多。

以前只用了其中的一种或几种(很少用)特性,现在真是开眼界了。

 

 

 

 

 

 

 

 

 

(仅作学习用,不做商业使用。不算侵权吧。)

meta标签的理解的更多相关文章

  1. meta标签viewport的深入理解(转)

    移动前端开发之viewport的深入理解 在移动设备上进行网页的重构或开发,首先得搞明白的就是移动设备上的viewport了,只有明白了viewport的概念以及弄清楚了跟viewport有关的met ...

  2. 深入理解css系列:meta标签

    积累太少,时间管理技巧欠缺,所以导致了博客更新的速度迟缓.学习中成长,成长中学习.加油吧!最近在做h5的项目,对于meta标签层出不穷的各式属性值有点头晕,所以查资料整理了下. 关键字:meta na ...

  3. 如何理解meta标签

    相信大家对meta标签都不陌生,但是打开某些网页源代码看到一堆的meta难免一脸蒙逼.废话少说,请大家更随我一起探索meta标签都有哪些属性以及作用. W3C给meta标签的定义是:<meta& ...

  4. <meta>标签元素的属性理解

    meta是用来在HTML文档中模拟HTTP协议的响应头报文.meta 标签用于网页的<head>与</head>中,meta 标签的用处很多.meta 的属性有两种:name和 ...

  5. html中meta标签及用法理解

    自己一直想成为高级前端开发工程师,而自学.奈何最近感觉自学收效甚微,一度迷茫. 不破不立,打算改变这样的状态. 春节后上班第一天,今年打算好好实现自己的前端梦想. 重新整理.总结前端技术. 废话,就不 ...

  6. 移动平台对于META标签的定义[转]

    下面介绍一些有关标记的例子及解释. 一.meta 标签分两大部分:HTTP 标题信息(http-equiv)和页面描述信息(name). 1.http-equiv 属性的 Content-Type 值 ...

  7. 移动平台对 meta 标签的定义

    一.meta 标签分两大部分:HTTP 标题信息(http-equiv)和页面描述信息(name). 1.http-equiv 属性的 Content-Type 值(显示字符集的设定) 说明:设定页面 ...

  8. HTML Meta标签

    Meta标签用于存储web页面上的信息.本质上讲,它是信息数据.他帮助浏览器和搜索引擎更好地知道.理解页面内容. Web开发者,通过Mata标签设置页面描述.作者或关键字等等.然而,许多meta标签功 ...

  9. HTML Meta标签中的viewport属性含义及设置

    两篇文章 第1篇文章 第2篇文章 http://blog.hexu.org/archives/1947.shtml 随着高端手机(Andriod,Iphone,Ipod,WinPhone等)的盛行,移 ...

随机推荐

  1. 会php不回缓存行吗?多重实现

    1.普遍缓存技术: 数据缓存:这里所说的数据缓存是指数据库查询PHP缓存机制,每次访问页面的时候,都会先检测相应的缓存数据是否存在,如果不存在,就连接数据库,得到数据,并把查询结果序列化后保存到文件中 ...

  2. cascading rollback 级联回滚

    Computer Science An Overview _J. Glenn Brookshear _11th Edition To emphasize the delicate nature of ...

  3. CC2540 USB DONGLE 使用 BTool 调试BLE 说明

    一.Btool软件界面介绍 首先您要将USBDONGLE插入电脑的USB口,然后打开双击打开Btool软件,打开后如下图所示: 在安装驱动的教程中,我们已经记住了我们的USB DONGLE的串口号,在 ...

  4. Qt编写自定义控件大全(liudianwu)

    http://www.cnblogs.com/feiyangqingyun/p/6128288.html http://www.qtcn.org/bbs/read-htm-tid-62279.html

  5. zepto源码--插入节点--学习笔记

    与生成width和height使用的方法类似,通过`after`, `prepend`, `before`, `append`,这四者之间的共性,生成对应的函数.并根据这四个函数,生成 `insert ...

  6. html5学习测试

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. 探讨mvc下linq多表查询使用viewModel的问题

    最近在开发mvc3的时候发现了一个问题,就是如何在view页面显示多表查询的数据,最简单的办法就是使用viewmodel了,以下本人使用viewmodel来实现多表查询的3中方法, 先贴代码再说: 1 ...

  8. [LeetCode]题解(python):079 Word Search

    题目来源 https://leetcode.com/problems/word-search/ Given a 2D board and a word, find if the word exists ...

  9. 【C++】动态内存与智能指针

    C++常见的内存分配方式有三种: 从静态存储区分配,这里主要是存储局部static对象,类的static成员以及定义在函数之外的变量: 从栈内存分配,这里主要是存储函数内的非static对象: 从堆内 ...

  10. connect调用超时的实现方式

    第二种更通用的.使connect调用超时的方法是使套接字成为无阻塞的,然后用select等待它完成.这种方法避免了使用alarm时遇到的很多问题,但我们必须承认,即使是在UNIX实现中,这种方法还是存 ...