Font Variations

and

More Lists

Part 1

In this lesson, you will learn how to change the appearance of text and additional tricks using lists on your Web page.

Changing Text Fonts

  1. Create and save a new HTML document in NotePad named textpage.htm
    • Remember all the codes for creating an new HTML document:
  2. Within the <title> tags, key the following: Student Name's Text Page, replacing "Student Name" with your name.
  3. To demonstrate how font face changes work, enter the following code within the <body> </body> tags.
    • NOTE: Be aware that if the user accessing your Web site doesn't have your specific font on their hard drive, the font will default back to regular font. Try to choose common fonts.

Changing Font Colors

  1. You can change the colors of text to add more interest to your Web page. To change the font color, add the following code after the code you just wrote (but before the closing </body> tag).
  2. Load this page into your Web browser to be sure the colors work all right.
  3. Next, fix the code so that each color starts on a new line (remember <br> ?).
  4. Add at least three new colors to the list.

More Colors

  1. You can get more accurate colors using the Hexadecimal Color Numbers. For a more comprehensive lising of HTML color values, visit the following page at www.W3Schools.com Type in two <br> tags after the last line of code. Then, add the following code (before the closing </body> tag).
  2. Add at least three new colors using the hexadecimal number code numbers. To find hexadecimal colors, try the Color Chooser.

More lists

  1. Type in two <br> tags after the last line of code, and then create a list with Roman Numerals using the following code:
  2. The following list will show how you can start a list at a particular number or with letters or with different bullets.
  3. Add the following code at the bottom of the preceding code.






  4. The last kind of list you will do is called a definition list. This is a double-leveled type of list. Enter the following code after the preceding code.

Check Your Work

You're finished with this lesson. Save your work and test your page in a Web browser. Fix any errors. Have your teacher check of this assignment.

Part 2

Now it's your turn. Create a new HTML document and name it vocab.htm

Use your Internet vocabulary list given during the lectures in class to create a Web page of all the terms we've covered as a class. Place a headline at the top of the page with the words "Internet Vocabulary." Your definition term should be bold with a different color than the actual definition.
Here's an example:

TCP/IP

(Transmission Control Protocol / Internet Protocol) - The protocols, or conventions, that computers use to communicate over the Internet.


If you do not have your definition terms, refer to the InternetVocab worksheet. You will be able to find almost all of the terms with a simple search using your favorite search site. For example: Go to http://www.google.com and search for a term like this -- what is ftp. You should get a good list of definitions.

Save your work and check it off with your instructor.

back to top