CSS Example Three

Creating Selectors

Customizing Selectors

Type some text

By starting a selector name with a dot, '.' you may create your own selectors. This is known as a class selector. Link to the style sheet.

This is an example of using the .quote selector. By the way, in FrontPage^Ž you may use the Style drop down menu to access your styles.

This is a limited H1 Style

The limited H1 style only allows that style to be applied to H1 tags. This makes it harder for a person to accidentally apply a style to an element of the page it was not meant to be applied to. Note this paragraph has the quote2 style applied but it does nothing.

This paragraph will have a unique style applied to it. This style may not be applied more than once in a document.

Now let's try to apply it again.... As you see, it is getting applied to this paragraph also. Well, this HTML document is not well formed! It has the same ID applied twice, this is a NO, NO! (Apparently these browsers don't do anything about it. So most references I've found suggest not to use it very often, if at all.

Now a quick look at SPAN and DIV. DIV allows you to define a block level element (space above and below). SPAN creates an in-line element. Using these elements allows a person to apply styles to just about any arbitrary text block. This block has a DIV tag around it. The white on black words have a SPAN tag around them.