Category Archives: html

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

Posted by takehito on 2011/3/8 火曜日 None comments

  • 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いずれも可

タグの機能

Posted by takehito on 2009/2/4 水曜日 None comments

相対パスで記述されたURLのベース（基準）をhead内で指定すると画像やリンク先のパスがベース（基準）で指定されたURLを基準に表示されます。
今日初めて知りました。

<head>
<base href="http://www.niwadesign.jp/">
</head>

下の図のような場合でも

e38394e382afe38381e383a3-1

■folder/index.html内の画像のパスの書き方

<img src="images/logo.gif" alt="ニワデザイン" />

このように記述すると階層がちがってもオッケーってことです。

なにかで使えるかも！？