Example: A Terry Pratchett Novel - I Shot the Serif - HTML with Style
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>
Produced by Stephanos Piperoglou
All Rights Reserved. Legal Notices.
URL: https://www.webreference.com/html/tutorial8/
Created: Oct 20, 1998
Revised: Nov 3, 1998