HTMLの <body> タグは、ウェブページ上でユーザーに表示されるコンテンツの全てを包含するセクションを定義します。ウェブページの <html> 要素の中で、<head> タグに続いて <body> タグが配置され、テキスト、画像、ビデオ、フォーム、スクリプトなどのコンテンツが含まれます。
<body> タグの基本的な使用法
<!DOCTYPE html>
<html>
<head>
<title>ページのタイトル</title>
</head>
<body>
<h1>これは大見出しです</h1>
<p>これは段落です。</p>
<img src="image.jpg" alt="説明文">
<!-- その他のHTML要素... -->
</body>
</html>この構造では、<body> タグの内部にページの主要なコンテンツが含まれており、ユーザーに表示される要素を指定しています。
<body> タグの特徴
- ブロックレベルのコンテナ:
<body>タグは、ページの見える部分を構成するブロックレベル要素を含むことができます。 - スタイルの適用: CSSを使用して
<body>要素にスタイルを適用することができます。例えば、背景色、フォント、マージンなどです。 - スクリプトの実行: JavaScriptは
<body>タグ内の要素に対して操作を行うことができます。
<body> タグの属性
<body> タグは、以下のようないくつかのグローバル属性をサポートしています。
- class: CSSクラスを指定します。
- id: ユニークなIDを指定します。
- style: インラインスタイルを適用します。
さらに、イベントハンドラの属性もサポートされており、ユーザーの操作に応じてJavaScript関数を実行できます。
- onload: ページのロード時に実行されるスクリプトを指定します。
- onclick: 要素がクリックされた時に実行されるスクリプトを指定します。
- など
<body> タグの重要性
<body> タグはウェブページの中心的な部分であり、ユーザーが直接インタラクトするコンテンツを含んでいます。このため、アクセシビリティ、SEO、ユーザーエクスペリエンスにおいて非常に重要な役割を果たします。正しく構造化された <body> タグは、コンテンツの意味と階層をブラウザや検索エンジンに伝えるために必要です。