- HTML Basics
- HTML Home
- HTML Basics
- HTML Document Structure
- HTML Data Types
- HTML Attributes
- HTML Fonts
- HTML Headings
- HTML Character Entities
- HTML Horizontal Line
- HTML Line Break
- HTML Paragraph
- HTML Citation Definition
- HTML Quotations
- HTML Comments
- HTML Styles
- HTML Formatting
- HTML CSS
- HTML Tags
- HTML Basic Tags
- HTML All Tags
- HTML Root Tags
- HTML Metadata Tags
- HTML Section Tags
- HTML Head Heading Tags
- HTML Flow Tags
- HTML Phrasing Tags
- HTML Embedded Tags
- HTML Interactive Tags
- HTML Meta Tags
- HTML Texts
- HTML Text Formatting
- HTML Physical Style Text
- HTML Logical Style Text
- HTML Organizing Text
- HTML Arranging Text
- HTML Displaying Lists
- HTML List
- HTML Links Tables
- HTML Links URLs
- HTML Links
- HTML URL Encode
- HTML Tables
- HTML Images Colors
- HTML Images Colors
- HTML Images
- HTML Color Codes
- HTML Canvas
- HTML Backgrounds
- HTML Forms
- HTML Forms
- HTML Form Tag
- HTML Input Tag
- HTML Button Tag
- HTML Multiple-Choice
- HTML Select Tag
- HTML Option Tag
- HTML Optgroup Tag
- HTML Textarea Label
- HTML Fieldset Legend
- HTML Datalist Tag
- HTML Keygen Tag
- HTML Output Tag
- HTML Progress Tag
- HTML Meter Tag
- HTML Submit Form
- HTML enctype Attribute
- HTML action Attribute
- HTML Method Attribute
- HTML Get Method
- HTML Post Method
- HTML Interactive
- HTML Interactive Web
- HTML Details Summary
- HTML Menu Tag
- HTML Command Tag
- HTML KBD Tag
- HTML Time Tag
- HTML Multimedia
- HTML Multimedia
- HTML Multimedia Tags
- HTML Audio Video
- HTML Embedded Multimedia
- HTML EMBED Tag
- HTML OBJECT Tag
- HTML FIGURE FIGCAPTION
- HTML Advance
- HTML Blocks
- HTML Classes
- HTML Iframes
- HTML JavaScript
- HTML Layouts
- HTML Responsive
- HTML Test
- HTML Online Test
- Give Online Test
- All Test List
HTML Backgrounds
By default, your webpage background is white in color.
HTML provides the following two good ways to decorate the background part of a web page.
HTML Background Colors
The background-color attribute is used to control the background of an HTML element, specifically page body and table background.
Following is the syntax to use background-color attribute with any HTML tag:
<tagname style="background-color:color_value;">
The background-color property specifies the background color of an element.
You can set the background color of a page is set like this:
<!DOCTYPE html> <html> <head> <title>HTML Background Color Example</title> <style> body { background-color: #dedede; } </style> </head> <body> <h2>Background Color Example</h2> <p>Hello Browser! This is a web page having colored background part.</p> </body> </html>
Here is the sample output produced by the above HTML background color example code:

A color is most often specified by the three methods give below:
- a HEX value like "#ff0000"
- a color name like "red"
- an RGB value like "rgb(255,0,0)"
To get all color codes, then refer HTML Color Codes tutorial.
In the example below, the <h2>, <p>, and <div> elements have different background colors:
<!DOCTYPE html> <html> <head> <title>HTML Background Color Example</title> <style> h1 { background-color: #dedede; } p { background-color: #ffeded; } div { background-color: #c0c0c0; } </style> </head> <body> <h2>HTML background color Example</h2> <div> This is a text inside a div element. <p>This paragraph has its own background color.</p> <p>If you unset the paragraph color, then it will inherited the color of div.</p> This is still in the div element. </div> </body> </html>
Here is the sample output displayed by the above HTML background color example code:

HTML Background Image
The background-image property specifies an image to use as the background of an element.
By default, the image is repeated so it covers the entire element. You can set the background image for a page like this:
<!DOCTYPE html> <html> <head> <title>HTML Background Image Example</title> <style> body { background-image: url("imagecol.jpg"); } h2 { color:white; } p { color:yellow; } </style> </head> <body> <h2>HTML Background Image</h2> <p>This is HTML Background Image Example.</p> </body> </html>
Here is the sample output displayed by the above HTML background image example code:

You can learn in detail about how to set different backgrounds of a web page at CSS Background tutorial.
« Previous Tutorial Next Tutorial »