HTML <body> Element

The <body> element represents the contents of an HTML document. It contains the page content presented to users, such as headings, paragraphs, links, images, forms, tables, and other HTML elements.

Syntax

<body>
  Page content
</body>

The <body> element is placed after the <head> section and contains the document's flow content.

Attributes

The <body> element supports the global HTML attributes. It also supports several event handler attributes associated with the browser window.

These include events related to printing, page navigation, online and offline status, messages, storage, and other window-level activity. In modern development, JavaScript event listeners are generally preferred over placing event handler code directly in HTML attributes.

Example

The following example shows the <body> element within a basic HTML document:

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Sample Web Page</title>
  </head>
  <body>

    <h1>Welcome to My Website</h1>
    <p>This content is contained inside the body element.</p>

  </body>
</html>

The metadata is contained inside <head>, while the heading and paragraph displayed on the page are contained inside <body>.

Try It Yourself

Edit the content inside the <body> element to see how headings, paragraphs, and other elements become part of the displayed web page.

Play in Editor

Usage Notes

A conforming HTML document contains only one <body> element. It follows the <head> and contains the document content that forms the web page.

Elements such as headings, paragraphs, links, images, navigation, sections, articles, forms, and tables normally appear inside the <body>. Metadata elements such as <title> and most <meta> elements belong inside <head> instead.

Although HTML allows the <body> start and end tags to be omitted under certain conditions, explicitly including both tags makes the document structure clearer and is recommended for beginner-friendly markup.

Older HTML used attributes such as bgcolor, background, text, and link color attributes directly on <body>. These presentation attributes are obsolete and CSS should be used to control the page's colors, background, spacing, and other visual properties.

Accessibility

The <body> contains the document's page content, so the structure within it plays an important role in accessibility. Use semantic elements and a logical heading structure to help users and assistive technologies understand and navigate the page.

When styling the <body>, maintain sufficient color contrast and avoid presentation choices that make text difficult to read or page content difficult to navigate.

Browser Support

Baseline: Widely available indicates a feature has been supported by core browsers for at least 30 months. At this stage, the feature is considered stable and safe for most websites to use without needing to worry about compatibility issues or fallbacks, as it is supported by the vast majority of users' devices and browser versions.

For detailed browser compatibility information, see Can I Use: HTML <body> Element .

<html> - Represents the root element of an HTML document and contains both the <head> and <body>.

<head> - Contains metadata and other information about the document.

<main> - Represents the dominant content within the document body.

Specifications

HTML Living Standard: The <body> Element

HTML <body> Element