Stylesheets and Classes

To re-use styles at multiple places in a document, you collect them in the head of your document and enclose them in a <style> element, like this:

<style type="text/css">
.warning {
	background-color: #ffffcc;

.bright {
	color: magenta;
	font-family: Helvetica, Arial;
	font-size: 18pt;

We took all the material in each style= attribute, put it inside curly braces instead of quote marks, and preceded it with a name that starts with a dot. This name is called a class name.

Now we can call up those styles by referring to their class names:

Try our 
<span class="bright">new improved</span>
cleaning fluid.
<span class="warning">Do not mix with ammonia.</span>
It's <span class="bright">easy to apply!</span>
<span class="warning">Keep out of reach
   of children.</span>
Which looks like this:

Try our new improved cleaning fluid. Do not mix with ammonia. It's easy to apply! Keep out of reach of children.

  Specifying Multiple Aspects  Index Summary