meta基础知识
H5页面窗口自动调整到设备宽度,并禁止用户缩放页面
<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"
/>
忽略Android平台中对邮箱地址的识别
<meta name="format-detection" content="email=no" />
当网站添加到主屏幕快速启动方式,可隐藏地址栏,仅针对ios的safari
< meta name="apple-mobile-web-app-capable" content="yes"
/>
< !-- ios7.0版本以后,safari上已看不到效果 -->
将网站添加到主屏幕快速启动方式,仅针对ios的safari顶端状态条的样式
<meta name="apple-mobile-web-app-status-bar-style"
content="black" />
< !-- 可选default、black、black-translucent -->
viewport模板
1.<!DOCTYPE html>
2.<html>
3.<head>
4.<meta charset="utf-8">
5.<meta
content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"
name="viewport">
6.<meta content="yes"
name="apple-mobile-web-app-capable">
7.<meta content="black"
name="apple-mobile-web-app-status-bar-style">
8.<meta
content="telephone=no" name="format-detection">
9.<meta content="email=no"
name="format-detection">
10. <title>标题</title>
11. <link rel="stylesheet"
href="index.css">
12. </head>
- 13.
14. <body>
15. 这里开始内容
16. </body>
- 17.
18. </html>
- 19.