Meta基础知识：

• H5页面窗口自动调整到设备宽度，并禁止用户缩放界面

一、HTML页面结构

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

• width ：设置viewport宽度，是一个正整数或字符串“device-width”；
• height：设置viewport高度，一般设置了宽度会自动解析出高度，可以不用设置；
• initial-scale：默认缩放比例，为一个数字，可以带小数；
• minimum-scale：允许用户最小缩放比例，为一个数字，可以带小数；
• maximum-scale：允许用户最大缩放比例，为一个数字，可以带小数；
• user-scalable： 是否允许用户手动缩放；

二、JS动态判断

var phoneScale = phoneWidth/640;
var ua = navigator.userAgent;
if (/Android (\d+\.\d+)/.test(ua)){
    var version = parseFloat(RegExp.$1);
    if(version>2.3){
        document.write('<meta name="viewport" content="width=640, minimum-scale = '+phoneScale+', maximum-scale = '+phoneScale+', target-densitydpi=device-dpi">');
    }else{
        document.write('<meta name="viewport" content="width=640, target-densitydpi=device-dpi">');
    }
} else {
    document.write('<meta name="viewport" content="width=640, user-scalable=no, target-densitydpi=device-dpi">');
}```

- #####空白页基本meta标签

<meta name="apple-mobile-web-app-capable" content="yes" />

<meta name="apple-mobile-web-app-status-bar-style" content="black" />

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

- #####其他meta标签

<meta name="renderer" content="webkit">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="HandheldFriendly" content="true">

<meta name="MobileOptimized" content="320">

<meta name="screen-orientation" content="portrait">

<meta name="x5-orientation" content="portrait">

<meta name="full-screen" content="yes">

<meta name="x5-fullscreen" content="true">

<meta name="browsermode" content="application">

<meta name="x5-page-mode" content="app">

<meta name="msapplication-tap-highlight" content="no">

##常见问题：
- #####移动端如何定义字体font-family
@ --------------------------------------中文字体的英文名称
@ 宋体      SimSun
@ 黑体      SimHei
@ 微信雅黑   Microsoft Yahei
@ 微软正黑体 Microsoft JhengHei
@ 新宋体    NSimSun
@ 新细明体  MingLiU
@ 细明体    MingLiU
@ 标楷体    DFKai-SB
@ 仿宋     FangSong
@ 楷体     KaiTi
@ 仿宋_GB2312  FangSong_GB2312
@ 楷体_GB2312  KaiTi_GB2312  
@
@ 说明：中文字体多数使用宋体、雅黑，英文用Helvetica

body { font-family: Microsoft Yahei,SimSun,Helvetica; }

- #####打电话发短信怎么实现
1 . 打电话
`<a href="tel:10086">打电话给:10086</a>`
2 . 发短信
`<a href="sms:10086">发短信给: 10086</a>`
3 . 写邮件

//注：在添加这些功能时，第一个功能以"?"开头，后面的以"&"开头
//1.普通邮件
<a href="mailto:mhb7724@qq.com">点击我发邮件</a>
//2.收件地址后添加?cc=开头，可添加抄送地址（Android存在兼容问题）
<a href="mailto:mhb7724@qq.com?cc=mi.haibo@trs.com.cn">点击我发邮件</a>
//3.跟着抄送地址后，写上&bcc=,可添加密件抄送地址（Android存在兼容问题）
<a href="mailto:mhb7724@qq.com?cc=mi.haibo@trs.com.cn&bcc=18510225441@163.com">点击我发邮件</a>
//4.包含多个收件人、抄送、密件抄送人，用分号(;)隔开多个邮件人的地址
<a href="mailto:mhb7724@qq.com;18510225441@163.com">点击我发邮件</a>
//5.包含主题，用?subject=
<a href="mailto:mhb7724@qq.com?subject=邮件主题">点击我发邮件</a>
//6.包含内容，用?body=;如内容包含文本，使用%0A给文本换行
<a href="mailto:mhb7724@qq.com?body=邮件主题内容%0A腾讯%0A腾讯">点击我发邮件</a>
//7.内容包含链接，含http(s)://等的文本自动转化为链接
<a href="mailto:mhb7724@qq.com?body=http://www.baidu.com">点击我发邮件</a>
//8.内容包含图片（PC不支持）
<a href="mailto:mhb7724@qq.com?body=