[ HTML ][ JavaScript ][ Computer Stuff ][ Freeing the Mind ]

Ken Ward's HTML Tutorial ...

Background Images

Valid XHTML 1.0!

The following are examples of background images;

My Home Page

My stuff.

<body background="backg3.jpg">

My Home Page

My stuff

<body background="PinkyStone.gif">

My Home Page

My stuff

<body background="BlueWool.gif">

My Home Page

My stuff

<body background="FleshyClay.gif">

My Home Page

My stuff

<body background="PinkBackground.gif">

My Home Page

My stuff

<body background="YellowBackGround.gif">

The backgrounds in the above (actually shown in a table above to make presentation easier) are small images which can make the page more attractive and more readable than a simple colour, because they can enable pattern effects. You can make background images by using an image editor. You can study other people's background images by right clicking on the page and choosing 'save background as ... '

You insert the background image into your document as follows;

<body background="FleshyClay.gif">

Where FleshyClay.gif is the name of the background image. You can use two types of image file on the net;

  • Gif files, that have the extension .gif, and
  • JPEG files which have the extensions .jpeg or .jpg (pronounced jay pegs!)

When you use an image editor for the internet, you need to be able to save files in one or more of these formats. JPEGs tend to make smaller files for larger images. GIFs can have transparent parts and are good for smaller images such as buttons.


Oh, you might have noticed lines on the page, such as the one above. These are called horizontal rules. You create a horizontal rule by place <hr> where you want the line in the document. It is a good idea to put a rule at the bottom of your document because otherwise, the text at the bottom of the page might be missed!

Let's look at horizontal rules!


[back to: page colour ][ home ][ contents ][on to: horizontal rules ]


Most Recent Revision: 18-Oct-98.
Copyright © 1998

I am always pleased to hear from you.
Send your comments to
and please visit: New Life Course