10. Body Attributes

In lesson 10 you will learn you to change the appearance of your page by adding attributes to the body tag. Some of these attributes you applied to your table tags. Now you will use them in your body tag as well.

Background Color

In following the rules of contrast and repetition, you will enhance the appearance of your page by changing the background color of your website.

Open your workspace; index.htm in notepad and in the browser. Locate the body tag. Inside the body tag, we will add the bgcolor attribute in order to change the background color of the page. You can use common color names, such as red, green or blue, or you can use the hexadecimal codes. We will make the background of the page the same color as the purple in the banners that appear at the top of each page. Add bgcolor="#660099". When using the hexadecimal codes, you should use the # sign before the number. Save and refresh in your browser.

Notice that the color changes in the outside of the page, but not inside the table. That is because we specified white as the background color of our table.

Links

Hyperlinks are given a blue color by default. Visited hyperlinks, meaning links that have been clicked on, are given a purple color by default. We can also define the color of an active hyperlink, or the color of link as it is being clicked on. Most of the time, you want to keep your hyperlinks the default color, because it makes it easy for the reader to find. But, other times it is necessary to change the color to meet your design. Again, these attributes go inside the body tag that already exists at the top of the page. You should change the color of the link, vlink, and alink to "#ffffcc". Save your work and preview it in the browser. The color of your links is now the same shade of yellow as the yellow stripe in your banner.

Text

The default color of text is black. But, it doesn't hurt to specify the color by adding the attribute to your body tag. Add: text="black". Check your work in your browser.

Since all of your pages should have the same look and feel, you will add these same attributes to the body tag of each page. You can do this by copying (control c) and pasting (control v) the opening body tag to replace the existing body tag in each of the remaining pages. Save and preview each page in the browser.