缘由
浙江新闻活动的福签页面，为了所有终端一屏显示的问题绕了很久。事实证明是我想的太复杂了，js做计算的时候以高度为准就能解决问题。但是总感觉这个适配方案不好，只能救急。
做广场舞的H5页面时见过某个视频网站的H5分享页有把viewport写死的，当时好奇但没深究。今天恰巧看到访问这篇博文。
天猫
在手机模式下看http://www.tmall.com/，发现它的
<meta name="viewport" content="width=320,maximum-scale=1.3,user-scalable=no,minimal-ui"> 320是iphone4，iphone5的宽度，1.3*320基本等于iphone6p的宽度。viewport写死为320后，很多元素的宽高都写死了，不用普遍使用百分比。
天猫的字体大小: 标题大致在14px,小文本或标题一般11px；
看博文说目前天猫的设计师是按375px作图的；另外，在iphone6p上看起来图还是有点糊的==
发现的一些meta标签
//这个就不扯了
<meta name="viewport" content="width=620,maximum-scale=1.3,user-scalable=no,minimal-ui">
//开启全屏模式
<meta name="apple-mobile-web-app-capable" content="yes">
//苹果工具栏和菜单栏 默认其实就是显示的
<meta name="apple-touch-fullscreen" content="no">
//默认值为default（白色），可以定为black（黑色）和black-translucent（灰色半透明）。
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
//电话号码不识别
<meta name="format-detection" content="telephone=no">
//iOS用rel="apple-touch-icon",android 用rel="apple-touch-icon-precomposed"。这样就能在用户把网页存为书签时，在手机HOME界面创建应用程序样式的图标。
<link rel="apple-touch-icon" href="/static/images/identity/HTML5_Badge_64.png" />
<link rel="apple-touch-icon-precomposed" href="/static/images/identity/HTML5_Badge_64.png" />
viewport宽度的选择
1.应当写死viewport的宽度（width=375）： 保存比例一致
如果你期望页面旋转时，每个元素所占的屏幕宽度比例一致，这样用户使用landscape时会看到更大的字和图。 如果你期望页面在不同分辨率的手机内，每个元素所占的屏幕宽度百分比一致时。
2.应当使用动态viewport宽度（width=device-width）：基本保持大小
如果你期望页面在大屏幕上显示更多内容，那么应当使用动态viewport宽度 当你的页面有文字时，动态宽度能基本保持字体的大小，而让大屏幕和选择手机时同一行展示更多的字当你需要想要在屏幕上显示宽度固定的元素时，例如小屏并排展示2个图，大屏展示3个图，每个图定屏幕显示的物理宽度时适合。