HTML Backgrounds

A good background can make a Web site look really great.

Examples

Good background and text color
An example of a background color and a text color that makes the text on the page easy to read.

Bad background and text color
An example of a background color and a text color that makes the text on the page difficult to read.

More Examples

Backgrounds

The <body> tag has two attributes where you can specify backgrounds. The background can be a color or an image.

Bgcolor

The bgcolor attribute sets the background to a color. The value of this attribute can be a hexadecimal number, an RGB value, or a color name.

<body bgcolor="#000000">
<body bgcolor="rgb(0,0,0)">
<body bgcolor="black">

The lines above all set the background color to black.

Background

The background attribute sets the background to an image. The value of this attribute is the URL of the image you want to use. If the image is smaller than the browser window, the image will repeat itself until it fills the entire browser window.

<body background="clouds.gif">
<body background="http://www.w3schools.com/clouds.gif">

The URL can be relative (as in the first line above) or absolute (as in the second line above).

Note: If you want to use a background image, you should keep in mind:

Will the background image increase the loading time too much? Tip: Image files should be maximum 10k
Will the background image look good with other images on the page?
Will the background image look good with the text colors on the page?
Will the background image look good when it is repeated on the page?
Will the background image take away the focus from the text?

Basic Notes - Useful Tips

The bgcolor, background, and the text attributes in the <body> tag are deprecated in the latest versions of HTML (HTML 4 and XHTML). The World Wide Web Consortium (W3C) has removed these attributes from its recommendations. In future versions of HTML, style sheets (CSS) will be used to define the layout and display properties of HTML elements.

Few of the most visited web sites use background images.

The most used background colors are: white, black and gray.

More Examples

Good background image
An example of a background image and a text color that makes the text on the page easy to read.

Good background image 2
An example of a background image and a text color that makes the text on the page easy to read.

Bad background image
An example of a background image and a text color that makes the text on the page very difficult to read.

Computer Joke

Support: "Type dir, space, a, colon."

Customer: "With a space after 'space'?"

Jump to: Top of Page or HOME or Printer friendly page

Search W3Schools:

What Others Say About Us

Does the world know about us? Check out these places:

Dogpile Alta Vista MSN Google Excite Lycos Yahoo Ask Jeeves

We Help You For Free. You Can Help Us!

W3Schools is for training only. We do not warrant its correctness or its fitness for use. The risk of using it remains entirely with the user. While using this site, you agree to have read and accepted our terms of use and privacy policy.

How we converted to XHTML

Active Server Pages Resource Web Site

Your own Web Site?

Read W3Schools
Hosting Tutorial

$15 Domain Name
Registration
Save $20 / year!

Advertise
at W3Schools

Only 0.5 CPM

SELECTED LINKS

University Online
Master Degree
Bachelor Degree

Web Software

The Future of
Web Development

Jobs and Careers

Web Security
Web Statistics
Web Standards

PARTNERS

W3Schools
TopXML
VisualBuilder
XMLPitstop
DevelopersDex
DevGuru
Programmers Heaven
The Code Project
Tek Tips Forum
ZVON.ORG
TopXML Search