<meta
name="属性名"
content="属性内容" >
1.viewport
移动端浏览器通常在一个比屏幕更宽的虚拟“窗口”（视口）中渲染页面，从而无需将所有页面都压缩进小屏幕里（如果把所有页面都压缩进手机的小屏幕里，很多没有针对移动端设计的网站就会被打乱），用户可以通过平移和缩放来浏览页面的不同区域。
iOS Safari最初引入“viewport”元标签来让开发者控制可视窗口的尺寸及比例。现在的移动端浏览器基本都支持这个标签。
一个典型的针对移动端优化的viewport包括下面内容：
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1,user-scalable=no">
属性说明：
width : 控制viewport大小，单位是px，可以指定一个数值或常量（device-width是一个常量，表示设备屏幕的宽度）；
height : 和width对应，常量为“device-height”
initial-scale：初始缩放比例，一般设为1
maximum-scale：允许用户缩放到的最大比例
minimum-scale：允许用户缩放到的最小比例
user-scalable：用户是否可以手工缩放，一般设为no不允许用户手工缩放。
参考：
https://developer.mozilla.org/zh-CN/docs/Mobile/Viewport_meta_tag
2.
format-detection属性,格式检测
<meta
name="format-detection"
content="telephone=no" >
在iPhone中，如果你写了一串普通数字（自己并没有加link样式），iPhone会自动把这个数字加上链接样式，点击这个数字还会自动拨号。telephone=no就禁止把数字转化为拨号链接，telephone=yes就开启了把数字转化为拨号链接，默认情况下是开启的。
<meta
name="format-detection"
content="email=no" >
告诉设备不识别邮箱地址，点击之后不自动发送。
email=no，禁止识别邮箱地址
<meta
name="format-detection"
content="address=no" >
禁止网页跳转地图（没用过还）
3.apple-mobile-web-app-capable属性，iPhone私有属性，全屏模式浏览
如果content设置为yes，Web应用会以全屏模式运行，反之，则不会。content的默认值是no，表示正常显示。
4.apple-mobile-web-app-status-bar-style，iPhone私有，屏幕顶部状态栏样式。
如果content设置为default，则状态栏正常显示。如果设置为blank，则状态栏会有一个黑色的背景。如果设置为blank-translucent，则状态栏显示为黑色半透明。如果设置为default或blank，则页面显示在状态栏的下方，即状态栏占据上方部分，页面占据下方部分，二者没有遮挡对方或被遮挡。如果设置为blank-translucent，则页面会充满屏幕，其中页面顶部会被状态栏遮盖住（会覆盖页面20px高度，而iphone4和itouch4的Retina屏幕为40px）。默认值是default。
1、移动网站要加的html5相关meta和标签
a、<!-- 强制让文档与设备的宽度保持1：1 -->
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
网页宽度默认等于屏幕宽度（width=device-width），
初始缩放比例（initial-scale=1）为1.0，即网页初始大小占屏幕面积的100%。
b、<!-- 删除默认的苹果工具栏和菜单栏 -->
<meta name="apple-mobile-web-app-capable" content="yes">
c、<!-- 在web app应用下状态条（屏幕顶部条）的颜色 -->
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
d、<!-- 禁止了把数字转化为拨号链接 -->
<meta name="format-detection" content="telephone=no">
e、<!-- 浏览网站时的小图标 -->
<link rel="shortcut icon" href="http://p.www.xiaomi.com/favicon.ico" type="/image/x-icon">
f、<!-- 添加至主屏时的图片 -->
<link rel="apple-touch-icon-precomposed" href="http://a.tbcdn.cn/mw/s/hi/tbtouch/images/touch-icon.png">
==================
还有一种有趣的方法
创建html5时发现这么一句话，如下：
<meta http-equiv=”X-UA-Compatible” content=”IE=edge,chrome=1″/>
这样写可以达到的效果是如果安装了GCF（Google Chrome Frame 谷歌内嵌浏览器框架的简称），则使用GCF来渲染页面，如果没安装GCF，则使用最高版本的IE内核进行渲染。这个插件可以让用户的IE浏览器外不变，但用户在浏览网页时，实际上使用的是Google Chrome浏览器内核，而且支持IE6、7、8等多个版本的IE浏览器。
