CSS Cookbook

This section contains a variety of short topics on how to style the HTML version of an e-text.

Before you can use CSS you must understand basic HTML←click that link. There are a number of HTML tutorials on the web such as W3schools's HTML tutorial or RichInStyle's. There is a huge repository of web-design material at The University of Minnesota-Duluth site, including a massive list of CSS references.

As motivation and a study aid, look at some of the PP examples on PG. Not just to admire them (although admiration is certainly in order) but to use the View>Page Source option of your browser and actually read the HTML to see how the effects were obtained!

The first topic in this section is a cursory intro to CSS for the person who knows HTML. However, you might prefer a gentler or more thorough introduction such as W3Schools's or RichInStyle's. If you are print-oriented, the absolute best book on CSS is Cascading Style Sheets: The Definitive Guide by Eric Meyer. A newer book with a different style is CSS: The Missing Manual; you can browse the TOC and chapter 1 online.

When you know CSS better there are many sites where people display the clever & amazing things you can do with it, for example RichInStyle and MeyerWeb—there's even a large site devoted to nothing but CSS list styles! Of course, most of these tricks aren't allowed in PG etexts!

CSS Topics

The example styles discussed here can be copied from the Styles page. In Browser issues is discussion of non-CSS browsers and of workarounds for the non-compliance of versions of Internet Explorer.

Other topics are:

• About: Terse intro to CSS syntax and use.
• Reference: Table of property names.
• Basic Text: Styling paragraphs and body margins.
• Heads: Styling headings and thought breaks.
• Lists: Styling lists.
• Tables: Styling tables and table entries.
• Block Quotes: Styling block quotes.
• TOC and Index: Styling the TOC, List of Illustrations, and Index.
• Images: Styling images.
• Poetry: Styling poetry.
• Sidenotes: Styling sidenotes and sidebars.
• Drama: Styling drama.
• Footnotes: Styling Guiguts's footnote code.
• Page Numbers: Styling Guiguts's visible page numbers.