iPhone用htmlのヘッダー要素のルールβ版

  • viewportは幅を指定するためのもの。
  • javascript部分はアドレスバーを非表示(画面の上に隠す)にするためのもの。
  • <link rel="apple-touch-icon" href="shortcut.png">はホームアイコンを設定するためのもの。
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<title>タイトル</title>
	<link rel="stylesheet" href="スタイルシートのパス" type="text/css">
	<link rel="apple-touch-icon" href="画像のパス">
	<script>
		function doScroll() { if (window.pageYOffset === 0) { window.scrollTo(0,1); } }
		window.onload = function() { setTimeout(doScroll, 100); }
	</script>
</head>

ホームアイコンを作成する

ツヤツヤ処理とか角丸とかは勝手にiPhone側でやってくれるのでベタなデザインにする。

画像サイズ
57×57ピクセル(但し、正方形であれば57ピクセル以上でも可)ただし、iPhone4は114×114

画像フォーマット
gif,jpg,png,bmpいずれも可

Leave a Comment


NOTE - You can use these HTML tags and attributes:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>