Embedded Stylesheets

The simplest way to use styles in an HTML document is by embedding the stylesheet in the head section of the document and then specifying HTML element classes where required.

<html>
  <head>
     <style type="text/css"> 
        .one{
               font-family:arial;
               color:red;}
        .two{text-decoration:underline;}
     </style>   
  </head> 
  <body>
     <div class="one">    
     </div>
  </body>
</html>

Note that HTML allows you to apply more than one style specification to an element thus:

<div class="one two">

The type="text/css" attribute for the style tag is not strictly necessary - most browsers figure out what is meant. However, omitting it will cause the HTML file to fail W3C validation tests.

Jump To...

Colophon