The Speed Coding

HTML <body> Tag


Example

A simple HTML document:

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

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

</html>

Definition and Usage

The <body> tag defines the document's body.

The <body> element contains all the contents of an HTML document, such as headings, paragraphs, images, hyperlinks, tables, lists, etc.

Note: There can only be one <body> element in an HTML document.


Browser Support

Element
<body> Yes Yes Yes Yes Yes

Global Attributes

The <body> tag also supports the Global Attributes in HTML.


Event Attributes

The <body> tag also supports the Event Attributes in HTML.


More Examples

Example

Add a background image to a document (with CSS):

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

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

</body>

Example

Set the background color of a document (with CSS):

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

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

</body>

Example

Set the color of text in a document (with 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.thespeedcoding.com">Visit TheSpeedCoding.com! </a></p >

</body>
</html >

Example

Set the color of unvisited links in a document (with CSS):

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

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

</body >
</html>

Example

Set the color of active links in a document (with CSS):

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

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

</body >
</html>

Example

Set the color of visited links in a document (with CSS):

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

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

</body >
</html>

Related Pages

HTML tutorial: HTML Elements

HTML DOM reference: Body Object

HTML DOM reference: document.body Property


Default CSS Settings

Most browsers will display the <body> element with the following default values:

Example

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

body:focus {
  outline: none;
}