Example: A Terry Pratchett Novel - I Shot the Serif - HTML with Style | WebReference

Example: A Terry Pratchett Novel - I Shot the Serif - HTML with Style

Front Page123456789

I Shot the Serif

Example: A Terry Pratchett Novel


In this example, an attempt is made to faithfully reproduce a piece of one of Terry Pratchett's novels. As with most novels, the paragraphs are close together (never mind how we do that for now) and have a small indent on the first line, which is specified using the text-indent property. They are also justified, using the text-align property. When Death speaks, his words are rendered in a bold Gothic font (font-weight and font-family) in uppercase (using text-transform). Some more properties that I haven't told you about yet make the whole text narrow, as if it was a page from a book. The stylesheet and document are the following:

BODY { background-color: white; color: black; }
DIV { width: 13cm; align: center; }
P {
 /* Indent and justify paragraphs, novel-style */
 text-indent: 2ex;
 text-align: justify;
 margin: 0;
}
.death {
 /* Death always speaks in bold Gothic small caps, 
    but we'll settle for uppercase */
 text-transform: uppercase;
 font-weight: bold;
 font-family: Gothic, fantasy;
}
P.source {
 /* Right-align the name of the source */
 text-indent: 0;
 text-align: right;
 width: 13cm; align: center; 
 margin-top: 0.5em; margin-left: 0.5cm;
}
CITE {
 /* Italicize the title */
 text-style: italic;
}
<DIV>
<P><SPAN CLASS="death">Rincewind?</SPAN> Death said, 
in tones as deep and heavy as the slamming of leaden 
doors, far underground.</P>
<P>'Um,' said Rincewind, trying to back 
away from that eyeless stare.</P>
<P><SPAN CLASS="death">But why are you here?</SPAN> 
(Boom, boom went crypt lids, in the worm-haunted 
fastnesses under old mountains...)</P>
<P>'Um, why not?' said Rincewind. 'Anyway, I'm sure 
you've got lots to do, so if you'll just-'</P>
<P><SPAN CLASS="death">I was surprised that you 
jostled me, Rincewind, for I have an appointment 
with thee this very night.</SPAN></P>
<P>'Oh no, not-'</P>
<P><SPAN CLASS="death">Of course, what's so bloody 
vexing about the whole business is that I was 
expecting to meet thee in Psephopolis.</SPAN></P>
<P>'But that's five hundred miles away!'</P>
<P><SPAN CLASS="death">You don't have to tell me, 
the whole system's got screwed up again. Look, 
there's no chance of you-?</SPAN></P>
<P>Rincewind backed away, hands spread 
protectively in front of him. The dried fish 
salesman on a nearby stall watched this madman
with interest.</P>
<P>'Not a chance!'</P>
<P><SPAN CLASS="death">I could lend you a 
very fast horse.</SPAN></P>
<P>'No!'</P>
<P><SPAN CLASS="death">It won't hurt a bit.</SPAN></P>
<P>'No!' Rincewind turned and ran. 
Death watched him go, and shrugged bitterly.</P>
<P CLASS="source">- Terry Pratchett, <CITE>The 
Colour of Magic</CITE></P>
</DIV>

Front Page123456789

http://www.internet.com

Produced by Stephanos Piperoglou

All Rights Reserved. Legal Notices.

URL: http://www.webreference.com/html/tutorial8/
Created: Oct 20, 1998
Revised: Nov 3, 1998