HTML meta标签小记加常用meta总结

meta提供页面的有关的元信息,不显示在页面上,而是提供给浏览器和搜索引擎搜索。
使用:放在head中,不需要关闭标签也没有内容


浏览器支持性:all
属性:charsetcontenthttp-equivnamescheme
  1. charset (h5)
    html5的新属性,指定html文档的字符编码

value:字符集,浏览器不能识别所有的字符集,广泛使用的有 UTF-8ISO-8859-1
eg: <meta charset='UTF-8'>
tip: html4中 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

  1. content
    描述html元数据,http-equiv和name值

eg: <meta name="keywords" content="创作,图文">
      <meta http-equiv="X-UA-Compatible" content="IE=Edge">

  1. http-equiv
    提供了http头,可以用来模拟http响应头

eg:<meta http-equiv="refresh" content="5">//5s后刷新页面
      <meta http-equiv="refresh" content="5,URL=https://www.baidu.com">//停留5s重定向后面的网址上

http-equiv 描述
X-UA-Compatible IE8的专用标记,用来模拟渲染方式 IE=edge,chrome=1 IE=edge告诉IE使用最新的引擎渲染网页,chrome=1则可以激活Chrome Frame
cache-control 请求和响应缓存机制 Public:指示响应可被任何缓存区缓存,可在多用户共存。
Private:缓存响应,但不能被共享缓存处理。
no-cache:响应不缓存。
no-store:用于防止重要的信息被无意的发布。在请求消息中发送将使得请求和响应消息都不使用缓存
max-age:[单位s]页面的最大缓存时间,时间内再次访问不会去服务器.
no-transform:百度官方给的禁止转码;
no-siteapp:禁止转码;等
expires 网页过期时间 必须使用GMT的时间格式
  1. name
    主要用于描述网页
    value: description|keyswords|viewport
    tip:如果设置了http-equiv属性,name属性就不应该设置了

keywords;
description;
author;
viewport:用于控制页面缩放
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
renderer:指定双核浏览器默认以何种方式渲染页面;
    <meta name="renderer" content="webkit"> //webkit内核
    <meta name="renderer" content="ie-comp"> //IE兼容内核
    <meta name="renderer" content="ie-stand"> //IE标准内核
     content的取值为webkit,ie-comp,ie-stand之一,区分大小写
robots:用来告诉搜索机器人哪些页面需要索引,哪些页面不需要索引。

  1. scheme
    format/URI不支持HTML5。 指定用于解释内容属性值的方案

常用meta总结

    
    <!-- 控制页面缩放 -->
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">

    <!-- 双核浏览器优先使用的极速模式(webkit)渲染 -->
    <meta name="renderer" content="webkit">

    <!-- IE8以最新标准渲染 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

   <!--打开dns预解析 -->
    <meta http-enquiv="x-dns-prefetch-control" content="on"/>

    <!-- 删除默认的苹果工具栏和菜单栏,默认是显示(无需添加 -->
    <meta name="apple-mobile-web-app-capable" content="yes" />

    <!-- 在webapp应用下状态条(屏幕顶部条)的颜色,默认default为白色,可以定义为黑色black和灰色半透明black-translucent) 
 注意:若值为“black-translucent”将会占据页面px位置,浮在页面上方(会覆盖页面20px高度–iphone4和itouch4的Retina屏幕为40px)-->
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <!-- IOS中禁用将数字识别为电话号码/忽略Android平台中对邮箱地址的识别 -->
    <meta name="format-detection"content="telephone=no, email=no" />
    <!-- uc强制竖屏 -->
    <meta name="screen-orientation" content="portrait">
    <!-- QQ强制竖屏 -->
    <meta name="x5-orientation" content="portrait">
    <!-- UC强制全屏 -->
    <meta name="full-screen" content="yes">
    <!-- QQ强制全屏 -->
    <meta name="x5-fullscreen" content="true">
    <!-- UC应用模式 -->
    <meta name="browsermode" content="application">
    <!-- QQ应用模式 -->
    <meta name="x5-page-mode" content="app">
    <!-- windows phone 点击无高光 -->
    <meta name="msapplication-tap-highlight" content="no">


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

推荐阅读更多精彩内容