几种常用 meta

1
2
3
4
5
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="format-detection" content="telephone=no, email=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />

详细说明

作用:IE = edge告诉IE使用最新的引擎渲染网页,chrome = 1则可以激活Chrome Frame.
X-UA-Compatible是自从IE8新加的一个设置,对于IE8以下的浏览器是不识别的,通过在meta中设置X-UA-Compatible的值,可以指定网页的兼容性模式设置。

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

 该meta标签的作用是让当前viewport的宽度等于设备的宽度,同时不允许用户手动缩放。

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

 telephone=no就禁止了把数字转化为拨号链接!告诉设备不识别邮箱,点击之后不自动发送email=no禁止作为邮箱地址!

<meta name="format-detection" content="telephone=no, email=no" />

 在iOS中有两个meta值,apple-mobile-web-app-capable和apple-mobile-web-app-status-bar-style,这两个会让网页内容以应用程序风格显示,并使状态栏显示默认颜色为黑色。
1
2
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />