标签:scree desc 标题 最新版本 pix htm init mic charset
<!doctype html> <html> <head> <meta charset="utf-8"> <title>手机网站</title> <meta name="keywords" content="" /> <meta name="description" content="" /> <meta name="author" content="" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" /> <script type="text/javascript"> //根据屏幕大小及dpi调整缩放和大小 (function() { var scale = 1.0; var ratio = 1; if(window.devicePixelRatio >= 2) { scale *= 0.5; ratio *= 2; } var text = ‘<meta name="viewport" content="initial-scale=‘ + scale + ‘, maximum-scale=‘ + scale + ‘, minimum-scale=‘ + scale + ‘, width=device-width, user-scalable=no" />‘; document.write(text); document.documentElement.style.fontSize = 50 * ratio + "px"; })(); </script> <!--启用 WebApp 全屏模式(IOS)--> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-touch-fullscreen" content="yes" /> <!--设置状态栏的背景颜色(IOS),在web app应用下状态条(屏幕顶部条)的颜色--> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <!--添加到主屏后的标题(IOS)--> <meta name="apple-mobile-web-app-title" content="标题"> <link rel="icon" href="http://ms0.meituan.net/touch/img/icon/favicon.ico" type="image/x-icon"> <!--苹果移动设备(ipod、ipad、iphone)对移动网站-mobile web进行收藏(“添加到桌面图标”)的时候增加的图标定义属性--> <link rel="apple-touch-icon-precomposed" sizes="57x57" href="http://ms0.meituan.net/touch/img/startup/apple-touch-icon-57x57-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="120x120" href="http://ms0.meituan.net/touch/img/startup/apple-touch-icon-120x120-precomposed.png"> <link rel="apple-touch-icon-precomposed" sizes="196x196" href="http://ms0.meituan.net/touch/img/startup/apple-touch-icon-196x196-precomposed.png"> <!--IOS Web app启动动画--> <link rel="apple-touch-startup-image" href="http://ms0.meituan.net/touch/img/startup/apple-touch-startup-image-640x1096.png" media="(device-height:568px)"> <link rel="apple-touch-startup-image" href="http://ms0.meituan.net/touch/img/startup/apple-touch-startup-image-640x920.png" media="(device-height:480px)"> <!-- iPhone --> <link href="apple-touch-startup-image-320x460.png" media="(device-width: 320px)" rel="apple-touch-startup-image"> <!-- iPhone (Retina) --> <link href="apple-touch-startup-image-640x960.png" media="(device-width: 320px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image"> <!-- iPad (portrait) --> <link href="apple-touch-startup-image-768x1004.png" media="(device-width: 768px) and (orientation: portrait)" rel="apple-touch-startup-image"> <!-- iPad (landscape) --> <link href="apple-touch-startup-image-748x1024.png" media="(device-width: 768px) and (orientation: landscape)" rel="apple-touch-startup-image"> <!-- iPad (Retina, portrait) --> <link href="apple-touch-startup-image-1536x2008.png" media="(device-width: 1536px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image"> <!-- iPad (Retina, landscape) --> <link href="apple-touch-startup-image-2048x1496.png" media="(device-width: 1536px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image"> <!--移动端手机号码识别(IOS)--> <meta name="format-detection" content="telephone=no"> <!--移动端邮箱识别(Android)--> <meta name="format-detection" content="address=no"> <!--优先使用最新版本 IE 和 Chrome--> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <link href="css/style.css" rel="stylesheet" /> <style> body { font-size: 62.5%; font-family: "Microsoft YaHei", Arial; overflow-x: hidden; overflow-y: auto; } .viewport { max-width: 640px; min-width: 300px; margin: 0 auto; } </style> </head> <body> <div> 大家好!这是手机网页! </div> </body> </html>
标签:scree desc 标题 最新版本 pix htm init mic charset
原文地址:https://www.cnblogs.com/susutong/p/9968253.html