meta 标签 详细说明

meta 标签可提供页面元素信息， 使用键值对的定义方式，可以记录网页上的主要信息，可以自定义键值对

属性 content（必须） ， name， http-equiv， scheme， lang

常用 meta 头：

设置编码信息                        <meta http-equiv="Content-Type" Content="text/html; Charset=utf-8" />
设置语言                                <meta http-equiv="Content-Language" Content="zh-CN" />
设置重定向                                <meta http-equiv="Refresh" Content="15; Url=http://www.baidu.com" />
设置缓存时间                        <meta http-equiv="Expires" Content="Web, 26 Jun 2015 18:21:57 GMT" />
不使用缓存                                <meta http-equiv="Pragma" Content="No-cach" />
设置关键字                                <meta name="Keywords" Content="key1,key2,..." />
设置描述信息                        <meta name="Description" Content="description abc" />
设置对搜索引擎抓取                <meta name="Robots" Content="All|None|Index|Noindex|Follow|Nofollow" />
设置可视区域                        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />

浏览器使用：
<!-- 国产浏览器内核选择 -->                                                                                        <meta name="renderer" content="webkit|ie-comp|ie-stand">
< !-- 使用最新版的ie浏览器，或者chrome-->                                                                <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
< !-- 针对手持设备优化，主要是针对一些老的不识别viewport的浏览器，比如黑莓 -->                <meta name="HandheldFriendly" content="true">
< !-- 微软的老式浏览器 -->                                                                                        <meta name="MobileOptimized" content="320">
< !-- 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">
< !-- 禁止转码 -->                                                                                                <meta http-equiv="Cache-Control" content="no-siteapp" />
禁止数字识自动别为电话号码                                                                                        <meta name="format-detection" content="telephone=no" />
禁止识别邮箱                                                                                                        <meta name="format-detection" content="email=no" />

ios特有：
启用webapp模式                        <meta name="apple-mobile-web-app-capable" content="yes" />
改变webapp模式下的外观        <meta name="apple-mobile-web-app-status-bar-style" content="black" />

windows phone 特有：
<!-- Windows 8 磁贴颜色 -->                                                                                <meta name="msapplication-TileColor" content="#000"/>
< !-- Windows 8 磁贴图标 -->                                                                                <meta name="msapplication-TileImage" content="icon.png"/>

对于content里面的键值对含义，可以自行搜索

时间： 2024-08-05 04:27:14

meta 标签 详细说明的相关文章

html meta标签用法详细介绍

meta是html语言head区的一个辅助性标签. 在页面中都有类似这样的html代码: <head> <meta http-equiv="content-Type" content="text/html; charset=gb2312"> </head> 一.meta标签的组成 meta标签共有两个属性,它们分别是http-equiv属性和name属性,不同的属性又有不同的参数值,这些不同的参数值就实现了不同的网页功能. 1.n

移动端-新建空白页面meta各个标签详细解读

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> </body> </html> meta标签 <meta name="viewport" content="width=device-width, i

移动平台对 META 标签的定义

下面介绍一些有关标记的例子及解释. 一.meta 标签分两大部分:HTTP 标题信息(http-equiv)和页面描述信息(name). 1.http-equiv 属性的 Content-Type 值(显示字符集的设定) 说明:设定页面使用的字符集,用以说明主页制作所使用的文字语言,浏览器会根据此来调用相应的字符集显示 page 内容. 用法: <meta http-equiv="Content-Type" content="text/html; charset=utf

meta标签常用属性整理

在segmentfault看到这篇文章,觉得整理的很详细,所以转载过来和大家分享一下.原文地址:http://segmentfault.com/blog/ciaocc/1190000002407912作者:ciaocc版权贵ciaocc所有,转载请注明版权. 概要 标签提供关于HTML文档的元数据.元数据不会显示在页面上,但是对于机器是可读的.它可用于浏览器(如何显示内容或重新加载页面),搜索引擎(关键词),或其他 web 服务. ——W3School 必要属性 属性 值 描述 content

Meta 标签详解

META标签是HTML语言HEAD区的一个辅助性标签,它位于HTML文档头部的标记和 标题 <<标记之间,它提供用户不可见的信息.meta标签通常用来为搜索引擎robots定义页面主题,或者是定义用户浏览器上的cookie:它可以用于鉴别作者,设定页面格式,标注内容提要和关键字:还可以设置页面使其可以根据你定义的时间间隔刷新自己,以及设置RASC内容等级,等等. 详细介绍 下面介绍一些有关 标记的例子及解释. META标签分两大部分:HTTP标题信息(HTTP-EQUIV)和页面描述信息(NA

Meta标签详解

Meta标签详解,在网上转的,希望对大家有用 引言 您的个人网站即使做得再精彩,在"浩瀚如海"的网络空间中,也如一叶扁舟不易为人发现,如何推广个人网站,人们首先想到的方法无外乎以下几种: ● 在搜索引擎中登录自己的个人网站 ● 在知名网站加入你个人网站的链接 ● 在论坛中发帖子宣传你的个人网站 很多人却忽视了HTML标签META的强大功效,一个好的META标签设计可以大大提高你的个人网站被搜索到的可能性,有兴趣吗,谁我来重新认识一下META标签吧! META标签是HTML语言HEAD区

meta标签详解(meta标签的作用)///////////////////////////转

meta标签详解(meta标签的作用) 很多人却忽视了HTML标签META的强大功效,一个好的META标签设计可以大大提高你的个人网站被搜索到的可能性,有兴趣吗,谁我来重新认识一下META标签吧 您的个人网站即使做得再精彩,在“浩瀚如海”的网络空间中,也如一叶扁舟不易为人发现,如何推广个人网站,人们首先想到的方法无外乎以下几种: ● 在搜索引擎中登录自己的个人网站 ● 在知名网站加入你个人网站的链接 ● 在论坛中发帖子宣传你的个人网站 很多人却忽视了HTML标签META的强大功效,一个好的MET

最齐全的站点元数据meta标签的含义和使用方法

最齐全的站点元数据meta标签的含义和使用方法 随着HTML5的流行和Web技术的不断演变,Meta标签队伍也越来越壮大,从Windows XP的IE6到现在Windows 7.Windows 8的IE9.IE10.IE11,对Html5的支持越来越好.html meta标签的功能作用也越来越强大. 首先.先说一下最初产生的一些经常使用meta标签. 从Meta标签的定义说起. Meta标签是HTML语言中HEAD区的一个辅助性标签,它位于HTML文档头部的<head>标记 和<titl

html meta标签使用总结（转）

之前学习前端中,对meta标签的了解仅仅只是这一句. <meta charset="UTF-8"> 但是打开任意的网站,其head标签内都有一列的meta标签.比如我博客的. 但是自己却很不熟悉,于是把meta标签加入了寒假学习计划的最前方. 简介 在查阅w3school中,第一句话中的"元数据"就让我开始了Google之旅.然后很顺利的在英文版的w3school找到了想要的结果.(中文w3school说的是元信息,Google和百度都没有相关的词条.但