1.常用的头部meta
以下三个meta必须首先放在<head>中，其它的<head>内容要放在其后<meta charset="utf-8">声明文档所使用的字符集
<meta http-equiv="x-ua-compatible" content="ie=edge,chrome=1">
在页面的头部加入
<meta http-equiv = "X-UA-Compatible" cotent = "IE=edge,chrome=1"/>
这样写可以达到的效果是如果安装了GCF，则使用GCF来渲染页面，如果为安装GCF，则使用最高版本的IE内核进行渲染。
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<a href="http://blog.doyoe.com/2015/10/13/mobile/%E7%A7%BB%E5%8A%A8%E5%89%8D%E7%AB%AF%E7%AC%AC%E4%B8%80%E5%BC%B9%EF%BC%9Aviewport%E8%AF%A6%E8%A7%A3/">viewport(视口详解)
</a>
2.声明文档的作者
<meta name="author（作者）" content="name, email@example.com">
<meta name="designer（设计者）" content="">
<meta name="owner（所有者）" content="">
3.SEO相关
<meta name="keywords" content="your tags(你的关键字标记短语)" />
每个网页应具有描述该网页内容的一组唯一的关键字。人们可能会搜索，并准确描述网页上所提供信息的描述性和代表性关键字及短语。标记内容太短，则搜索引擎可能不会认为这些内容相关。另外标记不应超过 874 个字符
<meta name="description" content="声明文档的描述消息.你的内容主要描述（控制在150个字符）">
搜索引擎索引方式，robotterms是一组使用逗号(,)分割的值，通常有如下几种取值：none，noindex，nofollow，all，index和follow。确保正确使用nofollow和noindex属性值。
<meta name="robots" content="index,follow" />
all：文件将被检索，且页面上的链接可以被查询；
none：文件将不被检索，且页面上的链接不可以被查询；
index：文件将被检索；
follow：页面上的链接可以被查询；
noindex：文件将不被检索；
nofollow：页面上的链接不可以被查询。
页面重定向和刷新：content内的数字代表时间（秒），既多少时间后刷新。如果加url,则会重定向到指定网页（搜索引擎能够自动检测，也很容易被引擎视作误导而受到惩罚）。
<meta http-equiv=“refresh” content=“刷新间隔的时间”>
<meta http-equiv="refresh" content="0;url=" />
4.apple
是否启动webapp功能，会删除默认的苹果工具栏和菜单栏。
<meta name="apple-mobile-web-app-capable" content="yes" />
当启动webapp功能时，显示手机信号、时间、电池的顶部导航栏的颜色。默认值为default（白色），可以定为black（黑色）和black-translucent（灰色半透明）。这个主要是根据实际的页面设计的主体色为搭配来进行设置。
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
网友评论