WilRose HTML Tutorial, a FREE on-line learning center


Download Some Cool Website Software Now !
This site designed with Web Page Creater 32 HTML Editor ver. 6.0

Introduction
Backgrounds
Fonts and Text
Accents
Lists
Images
Links
Tables
Frames
Forms
JavaScript
Great Books
Members Area

Backgrounds

Now let's add a background color to "MyPage.html".

<HTML>
<HEAD>
<TITLE> My first web page</TITLE>
</HEAD>

<BODY BGCOLOR=#FF00FF> This is my first web page

</BODY>
</HTML>

You can give your Web pages any background color that you like. The 6 digit color codes are based on a 16 bit counting system which for each digit runs from 0 to 9 then the letters A through F. The digits themselves represent variables of Red - Green - Blue, the first two digits representing Red the middle two - Green, and the last two - Blue. With 16 possible variables per digit, (0-1-2-3-4-5-6-7-8-9-A-B-C-D-E-F), and two digits per variables of Red for example, it is possible to choose from 256 shades of red. Total Black is #000000, and White is #FFFFFF. Here's an example.

Black - #000000
Red - #FF0000
Green - #00FF00
Blue - #0000FF
White - #FFFFFF <= (White text).

(Note to self: You can't see white text on a white or light colored backgrounds)

In the RGB structure of each two digit combination, think of the "0" as the lowest possible digit and the "F" as the highest possible digit (greater than 10, actually 16). Though the "0" is actually darkest and the "F" is the lightest. So the possible color variables are great. Example :

Color #FF009C
Color #7510BB
Color #CD559A
Color #0005BF

You can also simply code by the color name like so: <BODY BGCOLOR="yellow">

Try several colors on your own and do it both ways a few times. Put any text on your "MyPage.html" that you want.

Now let's use an Image file as a background. There are two types of Image file formats you can use. They are ".gif" and ".jpg" files. The coding is simple, you need only specify the exact file address of the image file you want to use. It looks like this:

<HTML>

<HEAD>

<TITLE>My first web page</TITLE>

</HEAD>

<BODY BACKGROUND="Images/Blue.gif"> This is my first web page

</BODY>

</HTML>

The new code is the file path to where the background image resides on your system, or on your web server. Create a sub-folder in your file folder "MyPage" and title it "Images". Copy the Image "blue.gif" into the new sub-folder. Just "click" your right mouse button on any spot on the blue background and save it in your "Images" sub-folder as "blue.gif". Copy any imagery you want into your new sub-folder. You can also use any imagery you want from other folders on your system when working off-line, you need only to specify the exact path to the file.


When you publish on the Internet you will have to keep it simple with no "File" address, only the exact folder the imagery will be stored in on your server. Play with the background imagery for a while. Keep in mind that the coding for the background image or color is always within the "<BODY>" tag.

Top of Page?



Tutorial Front Page / Fonts & Text / Accents / Lists
Images / Links / Tables / Frames / Forms / JavaScript
Cool Free Web Stuff / Recommended Books / Web Site Design / WilRose.com Home