常用的meta元素

charset

声明当前文档使用的字符编码,但可以被文档内任意元素的lang覆盖。

  • 尽量使用UTF-8
  • 不兼容ASCII的编码规范
  • 绝对不能使用CESU-8、UTF-7、BOCU-1及SCSU这一类编码
  • 不应该使用UTF-31,因为不能将它与UTF-16区别

content

基于内容,为http-equiv或name属性提供相关的值的定义

http-equiv

为枚举属性,定义能改变服务器和用户引擎行为的编译,他的编译值由content来定义。

1. content-language

定义页面使用的默认语言,但通常使用全局的lang属性。

2.Content-Security-Policy

允许站点管理者在指定的页面控制用户代理的资源,有助于防止跨站点脚本攻击。

3. default-style

指定要在页面上所使用的优选的样式表,他必须包含一个link元素,其href属性链接到CSS样式表或者CSS样式表的标题。

4. refresh

  • 如果content属性仅包含一个正整数的话表示每个多少秒就重新加载一次页面。
  • 如果content属性仅包含一个正整数和一个有效的URL的话表示多少秒后重定向到该另一个页面。

name

定义文档元数据的名称。

1. application-name

定义正运行在该网页上的网络应用名称。

2. author

这个文档的作者名称,可以用任意格式去定义

3. description

包括一个关于页面内容的缩略而精准的描述。

4. keywords

含有作为由逗号分隔的字符串,与网页的内容相关联的相关字。

5. generate

包含页面生成器的标识符。

6. referrer

控制从该文档发出的所有HTTP引用头

行为
no-referrer 不发送HTTP引用头
origin 发送文档起源
no-referrer-when-downgrade 向高级引用,不向低级引用
origin-when-crossorigin 执行相同来源的请求时发送一个完整的URL,但只送文档的起源。
unsafeURL 同源请求时发送一个完整的URL

7. creator

定义文件创建者的名称。

8. googlebot

机器人的代名词。

9. publisher

定义文件发布者的名称。

10. robots

定义爬虫应该和页面合作的行为。

行为
index 允许索引
noindex 拒绝索引
follow 允许追踪链接
nofollow 拒绝追踪链接
noodp 拒绝使用开放目录项目
noarchive 拒绝从页面的缓存搜索
nosnippe 拒绝显示搜索结果
noimageindex 拒绝引用索引图像
nodir 拒绝雅虎目录说明的使用
nocache 拒绝缓存

11. slirp

只在雅虎搜索中使用的robots的代名词

12. viewport

定义窗口的初始大小

取值范围 描述
width 一个正整数或者字符串 device-width 定义窗口宽度
height 一个正整数或者字符串 device-height 定义窗口高度
initial-scale 一个0.0 到10.0之间的正数 定义窗口到边框的距离
maximum-scale 一个0.0 到10.0之间的正数 定义可变最大值
minimum-scale 一个0.0 到10.0之间的正数 定义可变最小值
user-scalabl 一个布尔值(yes 或者no) 如果设置为no,用户无法在网页中放大。默认值是yes。

scheme

关于元数据的描述,是上下文更通顺。
示例:

<!-- Defining the charset in HTML4 -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<!-- In HTML5 -->
<meta charset="utf-8">

<!-- Redirect page after 3 seconds -->
<meta http-equiv="refresh" content="3;url=http://www.mozilla.org/">
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,332评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,508评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,812评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,607评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,728评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,919评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,071评论 3 410
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,802评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,256评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,576评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,712评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,389评论 4 332
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,032评论 3 316
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,798评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,026评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,473评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,606评论 2 350

推荐阅读更多精彩内容

  • 作者:彭志明日期:2017年4月29日 本文主要针对常用的meta元素的http-equiv,content属性值...
    pz明阅读 1,190评论 0 0
  • 1.meta的意义: 在HTML文档中,meta元素可放置在head标签内用于定义整个文档层面的元数据信息。使用m...
    马建阳阅读 910评论 0 2
  • 标签提供了 HTML 文档的元数据。元数据不会显示在客户端,但是会被浏览器解析。META元素通常用于指定网页的描述...
    shadow123阅读 590评论 0 0
  • 虽然之前我有整理过一次meta 标签,但是心中对于meta 标签还是一知半解,所以再次对meta 标签进行整理,并...
    微风玉米阅读 1,155评论 0 0
  • <meta>标签的定义和用法: 元素可提供页面的元信息,比如针对搜索引擎和更新频度的描述和关键字 一...
    饥人谷魏朋朋阅读 462评论 0 0