HTML <body>タグ


単純なHTMLドキュメント:

<html>
<head>
  <title>Title of the document</title>
</head>

<body>
  <h1>This is a heading</h1>
  <p>This is a paragraph.</p>
</body>

</html>

以下の「自分で試してみてください」の例をもっと見てください。


定義と使用法

<body>タグはドキュメントの本文を定義します

この<body>要素には、見出し、段落、画像、ハイパーリンク、表、リストなど、HTMLドキュメントのすべてのコンテンツが含まれています。

注:<body> HTMLドキュメントには要素を1つだけ含めることができます。


ブラウザのサポート

Element
<body> Yes Yes Yes Yes Yes

グローバル属性

この<body>タグは、HTMLのグローバル属性もサポートしています。


イベント属性

この<body>タグは、HTMLのイベント属性もサポートしています。



その他の例

ドキュメントに背景画像を追加します(CSSを使用)。

<html>
<head>
<style>
body {
  background-image: url(w3s.png);
}
</style>
</head>
<body>

<h1>Hello world!</h1>
<p><a href="https://www.w3schools.com">Visit W3Schools.com!</a></p>

</body>

ドキュメントの背景色を設定します(CSSを使用)。

<html>
<head>
<style>
body {
  background-color: #E6E6FA;
}
</style>
</head>
<body>

<h1>Hello world!</h1>
<p><a href="https://www.w3schools.com">Visit W3Schools.com!</a></p>

</body>

ドキュメント内のテキストの色を設定します(CSSを使用)。

<html>
<head>
<style>
body {
  color: green;
}
</style>
</head>
<body>

<h1>Hello world!</h1>
<p>This is some text.</p>
<p><a href="https://www.w3schools.com">Visit W3Schools.com!</a></p>

</body>
</html>

ドキュメント内の未訪問のリンクの色を(CSSを使用して)設定します。

<html>
<head>
<style>
a:link {
  color:#0000FF;
}
</style>
</head>
<body>

<p><a href="https://www.w3schools.com">W3Schools.com</a></p>
<p><a href="https://www.w3schools.com/html/">HTML Tutorial</a></p>

</body>
</html>

ドキュメント内のアクティブなリンクの色を(CSSを使用して)設定します。

<html>
<head>
<style>
a:active {
  color:#00FF00;
}
</style>
</head>
<body>

<p><a href="https://www.w3schools.com">W3Schools.com</a></p>
<p><a href="https://www.w3schools.com/html/">HTML Tutorial</a></p>

</body>
</html>

ドキュメント内の訪問したリンクの色を(CSSを使用して)設定します。

<html>
<head>
<style>
a:visited {
  color:#FF0000;
}
</style>
</head>
<body>

<p><a href="https://www.w3schools.com">W3Schools.com</a></p>
<p><a href="https://www.w3schools.com/html/">HTML Tutorial</a></p>

</body>
</html>

関連ページ

HTMLチュートリアル:HTML要素

HTML DOMリファレンス:ボディオブジェクト

HTML DOMリファレンス:document.bodyプロパティ


デフォルトのCSS設定

ほとんどのブラウザは<body>、次のデフォルト値で要素を表示します。

body {
  display: block;
  margin: 8px;
}

body:focus {
  outline: none;
}