HTML <body> Tag

The HTML <body> tag is used for creating a 'body' element. This element represents the main content section of the HTML document.

Generally, most content displayed on a typical web page is contained within the <body> element. Therefore, the <body> element usually contains many other elements (given the amount of content on a typical web page). This usually results in the <body> start tag being closer to the top of the document, with the end tag near the bottom.

The <body> element is categorized as "sectioning root". Most elements contained within the <body> are categorized as "flow content".

HTML documents must have no more than one <body> element.

Syntax

The <body> tag is written as <body></body> with the document's content inserted between the start and end tags. Any attributes can be inserted into the start tag (for example, <body onload="">). Note that there are 12 event handlers that are only available for the <body> element and the <frameset> element (these are listed further down this page).

The <body> must be the second element in an <html> element.

Like this:

✂ Copy to Clipboard
<!doctype html>
<html>
	<head>
		<title>Title...</title>
	</head>
	<body>
		Content goes here...
	</body>
</html>

Example

This example demonstrates how the <body> element appears within an HTML document. Notice that none of the content outside of the <body> element appear on the page.

Source CodeResult

Differences Between HTML 4 & HTML 5

The following attributes were supported in previous versions of HTML but are obsolete in HTML5:

HTML5 introduced the following event handlers that can be used with the <body> element and the <frameset> element.

To see more detail on the two versions see HTML5 <body> Tag and HTML4 <body> Tag. Also check out the links to the official specifications below.

Template

Here's a template for the <body> tag with all available attributes for the tag (based on HTML5). These are grouped into attribute types, each type separated by a space. In many cases, you will probably only need one or two (if any) attributes. Simply remove the attributes you don't need.

For more information on attributes for this tag, see HTML5 <body> Tag and HTML4 <body> Tag.

✂ Copy to Clipboard
<body  
 onafterprint=""
 onbeforeprint=""
 onbeforeunload=""
 onhashchange=""
 onmessage=""
 onoffline=""
 ononline=""
 onpagehide=""
 onpageshow=""
 onpopstate=""
 onstorage=""
 onunload=""
 
 accesskey=""
 class=""
 contenteditable=""
 contextmenu=""
 dir=""
 draggable=""
 dropzone=""
 hidden=""
 id=""
 itemid=""
 itemprop=""
 itemref=""
 itemscope=""
 itemtype=""
 lang=""
 spellcheck=""
 style=""
 tabindex=""
 title=""
 translate=""

 onabort=""
 onautocomplete=""
 onautocompleteerror=""
 onblur=""*
 oncancel=""
 oncanplay=""
 oncanplaythrough=""
 onchange=""
 onclick=""
 onclose=""
 oncontextmenu=""
 oncuechange=""
 ondblclick=""
 ondrag=""
 ondragend=""
 ondragenter=""
 ondragexit=""
 ondragleave=""
 ondragover=""
 ondragstart=""
 ondrop=""
 ondurationchange=""
 onemptied=""
 onended=""
 onerror=""*
 onfocus=""*
 oninput=""
 oninvalid=""
 onkeydown=""
 onkeypress=""
 onkeyup=""
 onload=""*
 onloadeddata=""
 onloadedmetadata=""
 onloadstart=""
 onmousedown=""
 onmouseenter=""
 onmouseleave=""
 onmousemove=""
 onmouseout=""
 onmouseover=""
 onmouseup=""
 onmousewheel=""
 onpause=""
 onplay=""
 onplaying=""
 onprogress=""
 onratechange=""
 onreset=""
 onresize=""*
 onscroll=""*
 onseeked=""
 onseeking=""
 onselect=""
 onshow=""
 onsort=""
 onstalled=""
 onsubmit=""
 onsuspend=""
 ontimeupdate=""
 ontoggle=""
 onvolumechange=""
 onwaiting=""
	>
</body>

* The attributes marked with an asterisk have a different meaning when specified on <body> elements as those elements expose event handlers of the Window object with the same names.

Tag Details

For more details about the <body> tag, see HTML5 <body> Tag and HTML4 <body> Tag.

Specifications

Here are the official specifications for the <body> element.

What's the Difference?

W3C creates "snapshot" specifications that don't change once defined. So the HTML5 specification won't change once it becomes an official recommendation. WHATWG on the other hand, develops a "living standard" that is updated on a regular basis. In general, you will probably find that the HTML living standard will be more closely aligned to the current W3C draft than to the HTML5 specification.