HTML 5画面対応ノート

共通ラベル

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



<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">


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


<link rel= "apple-touch-icon" sizes= "76x76" href= "touch-icon-ipad.png">
   apple-mobile-web-app-capable     yes  ，       safari                      。      apple-touch-icon   ，                     。

< link rel= "apple-touch-startup-image" href= "/startup.png">
   apple-mobile-web-app-capable     yes ，   WebApp      NativeApp     。  apple-touch-icon   ， apple-mobile-web-app-capable    sizes  ，   media          。          。


<link href="apple-touch-startup-image-640x920.png" media="(device-width: 320px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />


<meta name="format-detection" content="telephone=yes"/>

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


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


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

いどうたんし

<script type="text/javascript">
    var phoneW =  parseInt(window.screen.width),phoneScale = phoneW/750,ua = navigator.userAgent;
    if (/Android (\d+\.\d+)/.test(ua)){
      var version = parseFloat(RegExp.$1);
      if(version>2.3){document.write('', minimum-scale = '+phoneScale+', maximum-scale = '+phoneScale+', target-densitydpi=device-dpi">');
      }else{document.write('');}
    } else {document.write('');}
script>

Width:viewportの幅(200～10000、デフォルトは980ピクセル)
height:viewportの高さ(223から10000まで)
initial-scale:初期のスケール(範囲>0から10)
minimum-scale:ユーザーが縮小できる最小割合
maximum-scale:ユーザーが縮小できる最大割合
user-scalable:ユーザーが手動でスケールできるかどうか