<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <!-- THIS PAGE IS AUTOMATICALLY GENERATED. DO NOT EDIT. --> <!-- Fri Apr 5 00:53:09 2002 --> <!-- USING HT2HTML 2.0 --> <!-- SEE http://ht2html.sf.net --> <!-- User-specified headers: Title: ht2html.py -- A web page template processor --> <head> <title>ht2html.py -- A web page template processor</title> <meta http-equiv="Content-Type" content="text/html; charset=us-ascii"> <meta name="generator" content="HT2HTML/2.0"> <style type="text/css"> body { margin: 0px; } </style> </head> <body bgcolor="#ffffff" text="#000000" marginwidth="0" marginheight="0" link="#0000bb" vlink="#551a8b" alink="#ff0000"> <!-- start of page table --> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <!-- start of banner row --> <tr> <!-- start of corner cells --> <td width="150" valign="middle" bgcolor="#4fa445" class="corner"> <center> <a href="index.html"> <img alt="ht2html" border="0" src="ht2html.png"></a></center> </td> <td width="15" bgcolor="#89aaaa"> </td><!--spacer--> <!-- end of corner cells --> <!-- start of banner --> <td width="90%" bgcolor="#89aaaa" class="banner"> <!-- start of site links table --> <table width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="#ffffff"> <tr> <td bgcolor="#89aaaa"> <a href="index.html">Home</a> </td> <td bgcolor="#89aaaa"> <a href="http://www.python.org/">Python.Org</a> </td> <td bgcolor="#89aaaa"> <a href="http://barry.wooz.org/">Barry's home page</a> </td> <td bgcolor="#89aaaa"> <a href="http://sf.net/projects/ht2html">ht2html @ SourceForge</a> </td> </tr> </table><!-- end of site links table --> </td><!-- end of banner --> </tr><!-- end of banner row --> <tr><!-- start of sidebar/body row --> <!-- start of sidebar cells --> <td width="150" valign="top" bgcolor="#89aaaa" class="sidebar"> <!-- start of sidebar table --> <table width="100%" border="0" cellspacing="0" cellpadding="3" bgcolor="#ffffff"> <tr><td bgcolor="#238e68"><b><font color="#ffffff"> Subsections </font></b></td></tr> <tr><td bgcolor="#89aaaa"> <a href="index.html">Introduction</a> </td></tr> <tr><td bgcolor="#89aaaa"> <a href="components.html">Web page components</a> </td></tr> <tr><td bgcolor="#89aaaa"> <a href="bugs.html">Bugs and Peculiarities</a> </td></tr> <tr><td bgcolor="#89aaaa"> <a href="docstring.html">Usage</a> </td></tr> <tr><td bgcolor="#89aaaa"> <b>Using Stylesheets</b> </td></tr> <tr><td bgcolor="#89aaaa"> <a href="examples.html">Examples</a> </td></tr> <tr><td bgcolor="#89aaaa"> <tr><td bgcolor="#238e68"><b><font color="#ffffff"> ht2html sites </font></b></td></tr> <tr><td bgcolor="#89aaaa"> <a href="http://barry.wooz.org/">Barry's home page</a> </td></tr> <tr><td bgcolor="#89aaaa"> <a href="http://www.python.org/">Python.Org</a> </td></tr> <tr><td bgcolor="#89aaaa"> <a href="http://www.jython.org/">Jython.Org</a> </td></tr> <tr><td bgcolor="#89aaaa"> <a href="http://www.list.org/">GNU Mailman</a> </td></tr> <tr><td bgcolor="#89aaaa"> <a href="http://tmda.sf.net/">TMDA</a> </td></tr> <tr><td bgcolor="#89aaaa"> <a href="http://acvalbonne.online.fr/">Cycling Club</a> </td></tr> <tr><td bgcolor="#89aaaa"> <tr><td bgcolor="#238e68"><b><font color="#ffffff"> Email me </font></b></td></tr> <tr><td bgcolor="#89aaaa"> <a href="mailto:barry@python.org">Barry A. Warsaw</a> </td></tr> <tr><td bgcolor="#89aaaa"> </td></tr> <tr><td bgcolor="#89aaaa"> <a href="http://www.python.org/"> <center> <img alt="[Python Powered]" border="0" src="PythonPoweredSmall.png"></center> </a> </td></tr> <tr><td bgcolor="#89aaaa"> </td></tr> <tr><td bgcolor="#89aaaa"> © 1999-2002 </td></tr> <tr><td bgcolor="#89aaaa"> <a href="http://www.python.org/psf/">Python Software Foundation</a> </td></tr> <tr><td bgcolor="#89aaaa"> <hr> </td></tr> <tr><td bgcolor="#89aaaa"> <a href="style.ht">[page source]</a> </td></tr> </table><!-- end of sidebar table --> </td> <td width="15"> </td><!--spacer--> <!-- end of sidebar cell --> <!-- start of body cell --> <td valign="top" width="90%" class="body"><br> <h3>Using Stylesheets with HT2HTML</h3> <p>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 <tt>Skeleton</tt> 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.</p> <p>Fortunately, support has been added to support using stylesheets with HT2HTML, at least to some degree. Each of the <a href= "components.html">major components</a> of the page is assigned a class attribute that can be used in a stylesheet, with some special treatment for the continuation section.</p> <h4>Page Component Classes</h4> <p>Each of the page components is contained in an element which carries a <tt>class</tt> attribute with the same name as the component is given in the description of the <a href="components.html">page components</a>. The class names are given in all lower case. The <a href="components.html#continuation">continuation</a> component is treated a little specially since the general expectation is that it's content should be mostly like that of the <a href= "components.html#body">body</a>. Specifically, it is contained in a pair of elements, the outer having the class <tt>body</tt> and the inner having the class <tt>continuation</tt>. This allows a style sheet to set up all the normal body styles using the <tt>body</tt> class, and speciallize anything that needs to be by using both both in the selector, like this:</p> <blockquote> <pre> .body h2 { font-size: 120%; } .body .continuation h4 { font-size: 125%; } </pre> </blockquote> <p>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 <a href="components.html#banner">banner</a> and <a href= "components.html#sidebar">sidebar</a> do not appear to be "floating" on the page. Using a stylesheet, this bit of CSS can be used to add reasonable margins:</p> <blockquote> <pre> .continuation { margin-left: 1em; margin-right: 1em; } </pre> </blockquote> <h4>Generator Support</h4> <p>The <tt>Skeleton</tt> 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.</p> <dl> <dt><code><b>get_style()</b></code></dt> <dd>Return a fragment of a stylesheet that will be embedded into the page directly: <blockquote> <pre><style type="text/css"> /* This was returned by get_style() */ </style></pre> </blockquote> <p>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 <tt>style</tt> element will not be generated.</p> </dd> <dt><code><b>get_stylesheet()</b></code></dt> <dd>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: <blockquote> <pre><link rel="STYLESHEET" href="style.css" type="text/css"></pre> </blockquote> <p>An XML-style stylesheet link will be added as well:</p> <blockquote> <pre><?xml-stylesheet href="style.css" type="text/css"?></pre> </blockquote> <p>The code that generates the document header understands the file extensions <tt>.css</tt>, <tt>.xsl</tt>, and <tt>.xslt</tt>, and generate the right value for the <tt>type</tt> attribute.</p> </dd> </dl> </td><!-- end of body cell --> </tr><!-- end of sidebar/body row --> </table><!-- end of page table --> </body></html>