Using Stylesheets with HT2HTML

The HTML generated by HT2HTML contains a lot of style-based markup directly in the document. You can control just how much of this is done by controlling the generator class; the Skeleton class is fairly agressive about controlling the page layout using presentational markup, and tailoring that though subclassing can cause a good deal of duplicated code.

Fortunately, support has been added to support using stylesheets with HT2HTML, at least to some degree. Each of the major components of the page is assigned a class attribute that can be used in a stylesheet, with some special treatment for the continuation section.

Page Component Classes

Each of the page components is contained in an element which carries a class attribute with the same name as the component is given in the description of the page components. The class names are given in all lower case. The continuation component is treated a little specially since the general expectation is that it's content should be mostly like that of the body. Specifically, it is contained in a pair of elements, the outer having the class body and the inner having the class continuation. This allows a style sheet to set up all the normal body styles using the body class, and speciallize anything that needs to be by using both both in the selector, like this:

.body h2               { font-size: 120%; }
.body .continuation h4 { font-size: 125%; }

One common need is to add a little space between the edge of the browser's canvas (the portion of the display the content actually gets displayed on), and the text which is presented in the continuation area. This is needed since the normal margins are overridden so that the banner and sidebar do not appear to be "floating" on the page. Using a stylesheet, this bit of CSS can be used to add reasonable margins:

.continuation { margin-left: 1em;
                margin-right: 1em; }

Generator Support

The Skeleton generator base class supports two hooks that allow generators to add style information. Each of these takes the form of a method that can be overridden if needed.

get_style()

Return a fragment of a stylesheet that will be embedded into the page directly:

<style type="text/css">
/* This was returned by get_style() */
</style>

This stylesheet fragment must be written in CSS; XSLT is not supported here. If this function returns a string with not style information, or any false value, the style element will not be generated.

get_stylesheet()

This method should return a URL reference to the stylesheet that should be linked to from the generated page. For example, if this method returns 'style.css', the following link will be added to the generated document head:

<link rel="STYLESHEET" href="style.css" type="text/css">

An XML-style stylesheet link will be added as well:

<?xml-stylesheet href="style.css" type="text/css"?>

The code that generates the document header understands the file extensions .css, .xsl, and .xslt, and generate the right value for the type attribute.