我们来看看webkit内核中的一些私有的meta标签，这些meta标签在开发webapp时起到非常重要的作用
H5页面窗口自动调整到设备宽度，并禁止用户缩放页面，强制让文档的宽度与设备的宽度保持1:1，并且文档最大的宽度比例是1.0，且不允许用户点击屏幕放大浏览；
<meta content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0; user-scalable=0" name="viewport" />
当网站添加到主屏幕快速启动方式，可隐藏地址栏，仅针对ios的safari
<meta content="yes" name="apple-mobile-web-app-capable" />
将网站添加到主屏幕快速启动方式，仅针对ios的safari顶端状态条的样式
<meta content="black" name="apple-mobile-web-app-status-bar-style" />
忽略将页面中的数字识别为电话号码
<meta content="telephone=no" name="format-detection" />
忽略Android平台中对邮箱地址的识别
<meta content="email=no" name="format-detection" />
代码模板
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport"> <meta content="yes" name="apple-mobile-web-app-capable"> <meta content="black" name="apple-mobile-web-app-status-bar-style"> <meta content="telephone=no" name="format-detection"> <meta content="email=no" name="format-detection"> <title>标题</title> <link rel="stylesheet" href="index.css"> </head> <body> 这里开始内容 </body> </html> |
原创文章请注明转载自杭州WEB前端外包网站本文地址：http://hz.35ui.cn/post/31.html，标题：移动端meta标签的定义