Recap of Week 8:

More Style!

Styles are handy to format font color and font size for specific tags, but let's do something more exciting.  Well, maybe not exciting, but an easy way to add character to your site. 

We covered that fonts can be defined by using the <font> tag.  But you may want to use styles so that those changes propagate throughout your site.  You can define which font face to use, by using the family attribute of the font tag.  Here is an example to use Chiller font (if Chiller is not installed on that users machine, let them use Arial):
<html><head>
<style>
P {font-family: "Chiller", "Arial"}
</style>
</head></html>

If you really wanted to use that Chiller font to get a specific effect across, but the end user does not have that font installed, you still have a couple of choices:
1.  Convert the words to an image to get the desired effect.
2.  Embed the fonts in the page.

To embed the font into the page, you will have to convert chiller.ttf to chiller.eot (use WEFT ) or surf over to www.truedoc.com)

There are many ways to modify that text by color, font weight (bold or normal), size, etc.  Up 'till now we have defined colors by either using one of the predefined 16 color words (like gray, blue, black) or we would use the hexadecimal value (like #FFFFFF).  There is yet another way to accomplish this.  You can define the Red, Green, Blue composition.  This will really help those out who may only have a RGB color wheel or for those who work extensively with graphics and print shops who could better match a RGB value (sorry, no Pantone colors here).  Here is an example of an RGB color code:

P {font:"Chiller"; color:rgb(70%, 50%, 25%)}    or    P {font:"Chiller"; color:rbg(200, 120, 25)}

Remember that in the <Style> tag, we don't use =.  We instead use the colon :   The semicolon ;  is used to separate attributes.

Don't forget to read through your book. And as promised...the requirements for your final project are available from the syllabus schedule. Just click