Backgrounds

Background Images or Tiles
Background images enhance the look and design possibilities of web pages.

These gif files are generally very small and tile across and down the background of the web page. The size of the backgound gif file is important as large files take time to download. First catch your gif! If you click on any image with the left hand button of you mouse you can save it to you hard drive or floppy disk. Here's one for you to download for use in the first example. Save it as aus.gif

Background attribute This attribute specifies a URL pointing to an image file that's used as a background for the document. It always goes in with the body tag

Copy and paste the following example and save it as a text file bground.htm in the same directory where you saved the aus.gif file. Then open it with your browser

Below are a number of examples for you to click on and view. Take a look at the source of each one to check the background attribute in the body tag.

Bgcolor Browsers show the background as grey or white, or you can chose another color in the preferences, but the bgcolor attribute allows web page designers to designate their own preferred background colour. The great advantage of a background colour over a background image is that the browser sets up the colour instantly rather than downloading a gif file.

Type the following example and save it as a text file colour.htm , then open it with your browser

Text Colour Another attribute for controlling the look of a page is the text attribute which allows you to designate the colour of the text. The text attribute uses the same format as the bgcolor attribute

The colour of the text becomes particularly important if you use a black background, when the default black text would dissappear! The number for white is #ffffff

Copy and paste the following example and save it as a text file coltext.htm , then open it with your browser

Colour and Links The text attribute does not affect text that is used for links, however there are 3 more attributes that allow you to do control the 3 colours associated with links depending on whether they have been visited vlink or not or are active alink or not link .

Type the following example and save it as a text file "colink.htm" in the "bgimages" directory, then open it with your browser


Examples of Backgrounds
  1. Example 1
  2. Example 2
  3. Example 3
  4. Example 4
  5. Example 5
  6. Example 6
  7. Example 7
  8. Example 8
  9. Example 9
  10. Example 10
Return to top of page