Break the <FONT ...> Habit: SPAN and DIV
Sometimes you want to set the font styles of a range of text without associating that text with a particular logical markup such as
<EM> or <A ...> . In that case you'll find the
<SPAN ...> and <DIV ...> tags handy. <SPAN ...> and <DIV ...> were specifically created to allow for the free form application of styles.
<SPAN ...> is a text-level element. It should only be used to set text within a paragraph. For example, suppose we want a range of text which is big and red. We could create a
class like this (in a STYLE tag or in a style sheet file):
.bigred
{
font-size:30pt;
color:red;
font-weight:900;
}
Now we can apply the style to a span of text by setting its class to
bigred :
Are you <SPAN CLASS="bigred">crazy?</SPAN>
which gives us this sentence: Are you crazy?
<DIV ...> is a block level element. It starts a new paragraph at the beginning and closes the paragraph at the end. Styles are applied to <DIV ...> in the same way as for <SPAN ...> : set the class using the CLASS class attribute. So, for example, we can use the same style rule as above and apply it to a <DIV ...> like this:
<DIV CLASS="bigred">
Be sure to disconnect socket A from plug B or severe damage will occur.
</DIV>
which gives us
Be sure to disconnect socket A from plug B or severe damage will occur.
|