<body> Tag in HTML
FREE
Overview
In this article, you will learn about the HTML element called the <body> tag. The body tag contains all the main content of the webpage such as headings, paragraphs, images, tables etc. It is always enclosed within the <html> tag. Everything you see on the web browser will be present inside the <body> tag.
HTML <body> Tag
We all know that HTML is basically used to build websites that are available on the internet. HTML consists of series of elements like <head> tag <title> tag, etc that are used to structure the web page. One such element that is a home for all the other contents of the webpage such as headings, paragraphs, images, tables etc is HTML <body> Tag.
All the content inside the <body> tag is only visible on the webpage.
For example
As shown in the example, the <body> tag is always enclosed within the <html> tag and there can be only one <body> tag in the whole webpage. It is usually present after the <head> tag. The content in the tag is written between the opening (<body>) and closing (</body>) tags.
Syntax
Tag Specific Attributes
<body> tag has some attributes that change the way the web pages looks. Let's learn about a few of them.
| Attribute | Description |
|---|---|
| bgcolor | Colour of the Background of your page |
| alink | Color of text for links |
| background | Image to be used as a background |
| link | Color of text for links that are not visited |
| vlink | Color of text for visited links |
| text | Color of the text on your webpage |
| margins | Used to add margins to the webpage |
Window Event Attributes
There are some window event attributes that are script based and used within the <body> tag.
Few examples are given below for your reference.
| Attribute | Description |
|---|---|
| ononline | Script triggered when the browser starts to work online |
| onoffline | Script triggered when the browser starts to work offline |
| onload | Script triggered when the page is completely loaded |
| onerror | Script triggered when an error occurs |
| onpageshow | Script triggered when a user visits a page |
| onresize | Script triggered when the browser window is resized |
HTML <body> Tag Usage
Below is an example of basic structure of a webpage with <body> tag.
Explanation
- The <body> element contains all the contents of the webpage like the heading, paragraph, images, tables etc. Here <h1> element specifies a heading and <p> element specifies a paragraph.
- The <html> elements contains all the contents of the webpage.
- The <head> element contains additional information about the HTML page like the page title.
- The <title>element specifies a title for the webpage which is shown in the browser's window.
Below is another example <body> tag usage with bgcolor attribute.
Explanation
The HTML bgcolor attribute is used to set the background color of an HTML element.
Syntax
The Atrribute value can be anyone of the following:
- colorname: The background color is set by using the color name. For example “yellow”
- hexnumber: The background color is set using the color hex code. For example “#0000ff”.
- rgbnumber: The background color is set by using the RGB code. For example: “RGB(0, 153, 0)”.
Supported Browsers
HTML <body> tag is supported by all major web browsers. HTML <body> Tag is supported by all major web browsers as it is the main html element.
Below is the list of some major supported browsers.
- Google Chrome
- Internet Explorer
- Firefox
- Opera
- Safari
- Microsoft Edge
Summary
- The HTML <body> tag contains all the main content of the webpage such as headings, paragraphs, images, tables etc.
- All the content inside the <body> tag is only visible on the webpage.
- HTML <body> Tag has attributes like bgcolor, text etc that change the way webpage looks.
- HTML <body> Tag is supported by all major web browsers as it is the main html element.