<meta charset="UTF-8">
<!-- initial-scale=1 初始缩放比例
maximum-scale=1 允许用户缩放到的最大比例
user-scalable=no 用户是否可以手动缩放
这段代码的意思是，让 viewport 的宽度等于物理设备上的真实分辨率，不允许用户缩放。
一都主流的 web app 都是这么设置的，它的作用其实是故意舍弃 viewport，不缩放页面，
这样 dpi 肯定和设备上的真实分辨率是一样的，不做任何缩放，网页会因此显得更细腻。
-->
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<!--这meta的作用就是隐藏默认的苹果工具栏和菜单栏。content有两个值”yes”和”no”,当我们需要显示工具栏和菜单栏时，这个行meta就不用加了，默认就是显示。-->
<meta name="apple-mobile-web-app-capable" content="yes">
<!--在iPhone 手机上默认值是（电话号码显示为拨号的超链接）：可将telephone=no，则手机号码不被显示为拨号链接。-->
<meta content="telephone=no" name="format-detection">
<!-- 制定 iphone 中 safari 顶端的状态条的样式（default:白色，black:黑色，black-translucent：半透明。-->
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<!-- 针对手持设备优化，主要是针对一些老的不识别 viewport 的浏览器，比如黑莓 -->
<meta name="HandheldFriendly" content="true">
