Adjusting Background Color

Possibly the most useful reason to know something about HTML is so you are able to adjust your pages after creating them with WYSIWYG programs because they often do things you don't want.

Instead of writing code and making pages, we are going to alter the pages as we learn.

By adding a simple code to the <body> tag we can adjust the color of the page.

Colors are represented by six digit combinations of numbers and letters, i.e. 999AB3 and color names, like "blue".

Follow these steps to change the color of this page.

  1. Open the file in Dreamweaver.

  2. Save the page as "practice.htm" on your computer.

  3. Look in the Window menu and go to the HTML Source sub-menu (or push F10). A new window will appear, allowing you to edit the HTML.

  4. Find the body tag in the source, it will be near the top of the page.

  5. In the "body" tag, find "bgcolor". Change the "FFFFFF" to any 6-digit hexadecimal number (try "FF0000" for red, "00FF00" for green, "0000FF" for blue). Be sure the leave the six digits within quotation marks; the # sign is optional.

  6. Close the window. Your page will change color.



Your body tag should look something like this:
<body bgcolor="AAA123">

 

A note on hexadecimal numbers: these are numbers in base 16 and therefore need 16 digits to represent the numbers. The digits are the familiar 0 through 9, plus A, B, C, D, E and F. The first two digits in your six-digit number refer to the amount of RED in the color. The next two digits refer to the amount of GREEN in the color, and the last two digits refer to the amount of BLUE in the color. Contrary to common sense, FFFFFF is white (lots of red, green and blue mixed together), while 000000 is black (absence of any color). 
 

Here are some sample color codes: 

 
FF0000 00FF00 0000FF FFFF00 00FFFF FF00FF
CC0000 00CC00 0000CC CCCC00 00CCCC CC00CC
990000 009900 000099 999900 009999 990099
660000 006600 000066 666600 006666 660066
330000 003300 000033 333300 003333 330033
Grays are represented by numbers that all have the same digit:
 
000000 222222 444444 666666
888888 AAAAAA CCCCCC FFFFFF
You can have lots of fun by trying different number combinations!
 
FF6633 9933CC 34F051
6600FF FFCC00 8B0477
33CC33 053421 B38022
FF3366 823300 0153FF
CCCCFF 12D9C2 E8045F
 

Intro to HTML

Lessons:
   Creating a Web Page
   Background Color
   Unwanted Spaces
   Adding Spaces
   Working with Lists
   Fixing Bad Links
   Image Sources


Additional Resources

Teaching Guide


   





 
The contents of the Web Institute Web Site, including the On-Line Curriculum, Web Tank, and Session Notes, are Copyright 1999-2000, Graham School of General Studies, University of Chicago. No one may print, copy, or otherwise reproduce these materials without the express written permission of the Director of Education Programs at the Graham School. All rights reserved.

The chapters from Curriculum Webs: A Practical Guide to Weaving the Web into Teaching and Learning are Copyright 1999-2000, Craig A. Cunningham and Marty Billingsley. No one may print, copy, or otherwise reproduce these materials without the express written permission of the authors. All rights reserved.
The contents of the Web Institute Web Site, including the On-Line Curriculum, Web Tank, and Session Notes, are Copyright 1999-2001, Graham School of General Studies, University of Chicago. No one may print, copy, or otherwise reproduce these materials without the express written permission of the Director of the Web Institute for Teachers or the Dean of the Graham School. All rights reserved.