water28 @ ウィキ
water28 @ ウィキ

header

header要素

参考サイト：http://www.html5.jp/tag/elements/header.html
  • セクションの見出し（h1–h6 要素や hgroup 要素）
  • 検索フォーム
  • 関連ロゴ

h○要素

見出し要素(<h○>要素)の使い方について。

  • 見出しの等級はどうやって決めるのか。
①単純に大小関係で決めるやり方 
<h1>W3C・ワールド・ワイド・ウェブ・コンソーシアム</h1>
<h2>～ ウェブの潜在能力を最大限に引き出すために ～</h2>
デメリット：自由なサイト作りに支障が出てしまう可能性がある
②文書中の位置付けによって決めるやり方
文書全体を第一等級のブロックとし、それを適宜分割したブロックを第二等級のブロック、さらにそれらを適宜分割した第三等級ブロック（入れ子） 
<h1>W3C・ワールド・ワイド・ウェブ・コンソーシアム</h1> <h1 class="subTitle">～ ウェブの潜在能力を最大限に引き出すために ～</h1>

第一等級見出し(h1)と題名(title)の関係

  • <title>要素が背表紙のような役割を果たす
  • <h1>要素は表紙や本文第一ページ目の見出しのような役目を果たす

hgroup要素

参考サイト：http://ogawago.com/?p=7
参考サイト：http://www.html5.jp/tag/elements/hgroup.html
hgroup 要素の子孫に h1–h6 要素があれば、その中で最もランクが高い h1–h6 要素のテキストとなるよう定義 
<hgroup>
	<h1>タグライン/タイトル</h1>
	<h2>サブタイトル</h2>
</hgroup>
<h1>当サイトの共通情報</h1>

検索テキストの入力欄を作成する(google)

<form action="http://www.google.com/search" method="get">
	<label>Google: <input type="search" name="q" placeholder="キーワードを入力 ※必須" required></label> <input type="submit" value="Search...">
</form>

label要素

「header」をウィキ内検索
最終更新：2011年04月15日 00:50
ツールボックス

下から選んでください:

新しいページを作成する
ヘルプ / FAQ もご覧ください。