移动端开发常用设置。

以前好像也写过移动端开发的一些设置，但是零零散散的，这次想总结起来，免得自己又忘了！

1.移动端meta常见设置及释义

<meta charset="utf-8">
<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
<meta content="telephone=no" name="format-detection">
<meta content="email=no" name="format-detecation">
<meta content="yes" name="app-mobile-web-app-capable">
//当网站添加主屏幕快速启动方式，可以隐藏地址栏（苹果）。
<meta content="black" name="app-mobile-web-app-status-bar-style">
//当网站添加主屏幕快速启动方式，显示状态栏的样式（苹果）。

代码	释意
width=device-width	设置视口宽度等于设备宽度
initial-scale=1.0	初始化不缩放
maximum-scale=1.0	最大缩放比例1
user-scalable=no	禁止用户缩放页面
telephone=no	忽略页面中数字识别为电话
email=no	忽略页面中邮箱识别

Iphone5	4英寸	640*1136	326ppi
Iphone6	4.7英寸	750*1334	326ppi
Iphone7	5.5英寸	1080*1920	406ppi

2.移动端通过css媒体查询适配不同dpr的手机样式写法示例：

.box{
	width:375px;
	background-image:url('img_2x.png')
}

@media only screen(device-width:375px) and (-webkit-min-device-pixel-ratio:3){
	.box:{
		width:125px;
		background-image:url('img_3x.png')
		}
}