Recap of Week 7:

You Got Style!

As you dutifully put your html skills to practice, you may find formatting text a bit tedious. When managing a page (not to mention an entire site) you try to keep a consistent theme going. You may want all of your paragraphs to use red arial font. Although specifying every <font > tag would do the trick, that makes for a lot of typing. And what happens when you forget one of the tags? What a pain in the neck!

So instead, you decide to use styles. Styles are use to customize the default look for specific tags. (ever notice that it is not necessary to specify a <Font face="Times New Roman"> ? When you do not specify, it chooses a default of Black, Times New Roman, 12pt size.) Styles allow you to specify that every time you see a <TD> tag, make the font Blue and Bold.

How do we use styles? Glad you asked. Styles can be somewhere within your webpage, or it can be in a seperate file that gets called to by your webpage (as an external reference). If used as an external reference, it would take the name cis185.css as an example. This file only needs to be written once, and yet can be referenced by as many pages as you want and from even another domain!

Here is an example css file that we will call week7.css:
BODY {FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
    BACKGROUND-COLOR: GRAY
}

Don't worry that it is not all on one line, it would be easier to view if we did, but I did this to show you that it is not necessary. This file needs to be referenced in the html document like this...
<HTML>
<HEAD>
<TITLE> Page about Nothin </TITLE>
<LINK REL="stylesheet" TYPE="text/css" HREF="week7.css">
</HEAD>
<BODY>
This is a page about styles, yaddah yaddah blah blah..

What the above example would do is to make the background for Page About Nothin gray, and the font will be Verdana (and if you don't have that font, it will pick Arial..).

There are many more attributes and tags you can change. For example, in class we changed our text so that when you float your cursor over a hyperlink, the text changes to BOLD YELLOW. We also used styles to color the cells of a table yellow.

Your book has many examples of this, so check it out!

Hey, don't forget to do this weeks homework!

PS, here is another madlib for you. Enjoy!