!start!

here we will begin setting up your page. open a new notepad file. first, go to FILE. then to SAVE AS. save it as styles.css. now then. stylesheet syntax is very easy to learn. it is composed of three basic parts: the selector, the property, and the value. here's what it looks like in the css document:

selector { property: value, value; property: value }

you see how the values are separated by a comma (,), and the properties are separated by a semicolon (;), and the properties identify the value with a colon (:)? good. now there are some new tags and markup you will need to learn before we begin.

comments. remember in html how you used comments to tell yourself what you did or where you were in the page? well, with css you can do the same thing. however, you don't use the  tag, you use the /* */ for commenting a block of text. the /* starts a comment, while the */ ends it.

below are a list of new tags you will use when you "cascade"...

tag explanation

<SPAN> this tag was created for the sole purpose of css. it doesn't do anything, but now you can make it do something.

CLASS this is actually an attribute. when you put it in it makes a sort of different tag. like a sister tag to the original, you can use it to create different things with th limited amount of tags html gives you to work with

ID this, like CLASS, is an attribute, it is useful for identifying different things that have the same name. variables, basically.

<DIV> we already went over this, but for a review, click here

now you know the tags, you know how to put them in, lets do a dry run, and then we'll move onto specific tags.

tag	explanation
`<SPAN>`	this tag was created for the sole purpose of css. it doesn't do anything, but now you can make it do something.
`CLASS`	this is actually an attribute. when you put it in it makes a sort of different tag. like a sister tag to the original, you can use it to create different things with th limited amount of tags html gives you to work with
`ID`	this, like `CLASS`, is an attribute, it is useful for identifying different things that have the same name. variables, basically.
`<DIV>`	we already went over this, but for a review, click here

alright, for our dry run, i will show you how to put a stylesheet document together. and i will use the A tag as an example (since i know you all want to know how to make it change colors).

A:active { text-decoration:none; color: #FFA500} A:visited { text-decoration:none; color: #FFA500} A:link { text-decoration:none; color: #FFA500} A:hover { text-decoration:none; color: #31B5D6}

now i took that directly from my css code. what it translates into is this: active link= no underline, orange color; visited link= no underline, orange color; regular link= no underline, orange color; hovering over link= no underline, light blue color. text-decoration has four accatt's: none, underline, overline, blink. again, blink only works in netscape.

ok, now we'll go on to show you more selectors at fontorama ť.