Embedded Style Sheet Example

Custom box class

Here is box class expressed as an internal style sheet. It draws a red box around some displayed block such as a preformatted block. The box class is an example of a custom class that is not associated with any particular element (tag). It can be used with any element.

<style type="text/css">
   .box       
   { 
      border: 1pt; border-color: red; border-style: solid; width: 0%;
      margin: 1em;
   }
</style>

The width of 0 percent makes the box just fit a preformatted display but gives quite diferent results if used with a paragraph tag.

It can be used to put a box around some displayed text such as the following Java code

for (int n = 1; n <= 10; n++)
{
   System.out.print(n + " ");
}
System.out.println();

The boxes are produced using html code of the form

<pre class = "box">
...
...
</pre>

When used for a paragraph we get the results of this paragraph.

A width should be specified if you want to use it this way.