1.定义

meta元素提供页面的原信息,位于文档头部

2、必须的属性

content属性

该属性提供名称/值对中的值,使用要与http-equiv或name属性一起使用

3、可选的属性

3.1、http-equiv 属性

对应的值有:content-type、expires、refresh、set-cookie

该属性把content属性关联到http头部,提供名称/值对中的名称,指示服务器在发送实际文档之前要传送给浏览器MIME文档头部包含名称/值对

该属性对应的值还有X-UA-Compatible,是ie8新加的一个设置,对于ie8以下的浏览器是不识别的,通过它可以指定网页的兼容模式

<meta http-equiv="X-UA-Compatible" content="IE=7">
#以上代码告诉IE浏览器,无论是否用DTD声明文档标准,IE8/9都会以IE7引擎来渲染页面。
<meta http-equiv="X-UA-Compatible" content="IE=8">
#以上代码告诉IE浏览器,IE8/9都会以IE8引擎来渲染页面。
<meta http-equiv="X-UA-Compatible" content="IE=edge">
#以上代码告诉IE浏览器,IE8/9及以后的版本都会以最高版本IE来渲染页面。
<meta http-equiv="X-UA-Compatible" content="IE=7,IE=9">
<meta http-equiv="X-UA-Compatible" content="IE=7,9">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
#以上代码IE=edge告诉IE使用最新的引擎渲染网页,chrome=1则可以激活Chrome Frame.

服务器向浏览器发送文档时,至少要发送一个:content-type:text/html,告诉浏览器准备接受一个html文档

3.2、name属性

对应的值有:author、description、keywords、generator、revised、others

该属性把content关联到一个名称,提供名称/值对中的名称

<meta name="keywords" content="HTML,ASP,PHP,SQL">

这样的meta标签有助于搜索引擎对文档进行分类

name的值为viewport时,可以指定用户是否可以缩放web页面

<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">

width:控制 viewport 的宽度,可以是一个定值,如 600,或者特殊的值,如 device-width 为设备的宽度(单位为缩放为 100% 时的 CSS 的像素)。
initial-scale:初始缩放比例,也即是当页面第一次 load 的时候缩放比例。
maximum-scale:允许用户缩放到的最大比例。
minimum-scale:允许用户缩放到的最小比例。
user-scalable:用户是否可以手动缩放 

<meta name="format-detection" content="telephone=yes"/>

在iPhone 手机上默认值是(电话号码显示为拨号的超链接),若将telephone=no,则手机号码不被显示为拨号链接  

<meta name="apple-mobile-web-app-capable" content="yes" />

网站开启对web app程序的支持

<meta name="apple-mobile-web-app-status-bar-style" content="black" />

在web app应用下状态条(屏幕顶部条)的颜色

默认值为default(白色),可以定为black(黑色)和black-translucent(灰色半透明)

3.3、scheme属性

用于翻译content属性值的格式

html中的meta标签的更多相关文章

  1. HTML中的<meta>标签的使用

    HTML中<meta>标签的使用 在我们制作的网页中,要是想让它能够让更多的人去访问,最好的方法就是通过搜索引擎来找到你的网址,于是需要你的网页可以有关键词能够让搜索引擎来识别,于是HTM ...

  2. 手机页面中的meta标签

    以前看书的时候,觉得meta标签就只有一个charset对于我来说是有用的.前段时间有个学弟让我写个手机版的网页,我才知道原来meta标签有那么多学问. meta指元素可提供有关页面的元信息(meta ...

  3. HTML 中的meta标签中的http-equiv与name属性使用介绍

    meta是html语言head区的一个辅助性标签.也许你认为这些代码可有可无.其实如果你能够用好meta标签,会给你带来意想不到的效果,meta标签的作用有:搜索引擎优化(SEO),定义页面使用语言, ...

  4. 浅析网站开发中的 meta 标签的作用

    *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !important; } /* ...

  5. javaWeb学习总结(4)- HTML 关于head中的<meta>标签

    关于<meta> 标签 <meta>标签出现在网页的标题部分,这些信息并不会出现在浏览器页面的显示之中,只会显示在源代码中.也就是在...当中. 主要用途是设置网页语言的编码方 ...

  6. html中的meta标签是什么?有哪些属性?

    meta标签介绍 meta标签是HTML语言head区域的一个辅助性标签,常用于定义页面的说明,关键字,最后修改的日期和其他的元数据.这些元数据将服务于浏览器,搜索引擎和其他网络服务. meta标签的 ...

  7. HTML中的Meta标签详解

    emta标签的组成:meta标签分两大部分:HTTP-EQUIV和NAME变量. HTTP-EQUIV:HTTP-EQUIV类似于HTTP的头部协议,它回应给浏览器一些有用的信息,以帮助正确和精确地显 ...

  8. Android在代码中获取meta标签内容

    最近写SDK需要获取<meta>标签的值,网上资料很多~分享是件好事~我很快就找到了相关资料. 下面贴上代码: ApplicationInfo appInfo = null; String ...

  9. JSP页面中的Meta标签详解

    Meta标签详解 相信大家在平时开发中最常接触的页面就是html和jsp了,可在这两个页面中有一个Meta标签你天天都会看见,可是你真的了解这个标签的一些其他用处吗?今天给大家介绍一些该标签的其他应用 ...

随机推荐

  1. Angular-Cli中引用第三方库

    最近在学习angular(AngularJS 2),根据教程使用angular-cli新建项目, 然而在添加JQuery和Bootstrap第三方库时遇到了问题... 初试 我最初的想法是直接将相对路 ...

  2. volatile并不能保证数据同步、只能保证读取到最新主内存数据

    在 java 垃圾回收整理一文中,描述了jvm运行时刻内存的分配.其中有一个内存区域是jvm虚拟机栈,每一个线程运行时都有一个线程栈, 线程栈保存了线程运行时候变量值信息.当线程访问某一个对象时候值的 ...

  3. codeforces 730 j.bottles

    J. Bottles time limit per test 2 seconds memory limit per test 512 megabytes input standard input ou ...

  4. 单选 name的值相同时候 就会产生互斥现象

  5. BZOJ3052 & UOJ58:[WC2013]糖果公园——题解

    http://uoj.ac/problem/58 http://www.lydsy.com/JudgeOnline/problem.php?id=3052 输入格式 输出格式 input 4 3 5 ...

  6. BZOJ1596 [Usaco2008 Jan]电话网络 【树形dp】

    题目链接 BZOJ1596 题解 先抽成有根树 设\(f[i][0|1][0|1]\)表示以\(i\)为根,儿子都覆盖了,父亲是否覆盖,父亲是否建塔的最少建塔数 转移一下即可 #include< ...

  7. NOIP2016Day2T3愤怒的小鸟(状压dp) O(2^n*n^2)再优化

    看这范围都知道是状压吧... 题目大意就不说了嘿嘿嘿 网上流传的写法复杂度大都是O(2^n*n^2),这个复杂度虽然官方数据可以过,但是在洛谷上会TLE[百度搜出来前几个博客的代码交上去都TLE了], ...

  8. [转]Android 如何根据网络地址获取网络图片方法

    http://blog.csdn.net/xiazdong/article/details/7724103 目录(?)[-] h2pre namecode classhtml stylefont-we ...

  9. SQL_MODE

    一 声明 标红部分为重点了解 原文:https://segmentfault.com/a/1190000005936172 二 SQL_MODE参数值 官方手册专门有一节介绍 https://dev. ...

  10. JS深度合并对象

    /** * 如果target(也就是FirstOBJ[key])存在, * 且是对象的话再去调用deepObjectMerge, * 否则就是FirstOBJ[key]里面没这个对象,需要与Secon ...