Traditional HTML changes the format of text by enclosing it between an opening and closing tag. The text between the tags is marked up according to the tag's instructions, and as we have already learnt, colour, size, font, weight, underlining etc can all be controlled this way.
What if we wanted to change all of the text on a page to a different font size? This could be very difficult in a complex page, but with Cascading Style Sheets the process is much more simple.
CSS takes a different approach - it allows you to define what each tag actually does to the text it encloses, or to make your own style definitions, covering all the areas mentioned above and adding lots of new control in areas which can't be changed with HTML alone.
Take a look at the following
<font color="red">This text will be red</font>
Heres a new way to show red text
<span style="color: red;">This text will be red</span>
So what I hear you thinking! Surely this is more difficult still - but learning a little more will make control of the style of your site much easier and more consistent.
Look at the statement above. We use a SPAN tag to enclose the text selection, but we could have used the style attribute in almost any tag, often the P paragraph tag being used to control the style of a whole paragraph.
We then added a style attribute followed by a single style attribute to change the colour of the text enclosed by the span. Note the semi-colon after the style attribute - to add more attributes simply continue with the next one after the semi-colon, and don't forget to place a semi colon at the end of the new attributte.
Heres a new way to show red text with a background colour
<span style="FONT-WEIGHT: bold; FONT-SIZE: 13px; COLOR: red; FONT-FAMILY: verdana; BACKGROUND-COLOR: green; TEXT-DECORATION: underline; character-spacing: 10px;">
This text will be big and red (and horrible!)
</span>
and find out how to make a css page in EHTML. Click the [ Next ] to continue.