Sams Teach Yourself XML in 21 Days

Recommended Book

Sams Teach Yourself XML in 21 Days, 3rd Edition

Learn More Buy

Recommended Book

Recommended Book 

Sams Teach Yourself XML in 21 Days, 3rd Edition

Learn More Buy

Using CSS

CSS lets you format the visual appearance of HTML and CSS by using style sheets. Style sheets are collections of style rules, and each rule shows how to format an XML element. A rule is made up of a selector, which is the element or elements you want to format, and the rule specification, which shows the format you want.

There are a number of ways of creating selectors. For example, you can list an XML element by name, you can create style classes, you can select elements by ID value, and so on.

The second part of a rule, the rule specification, is made up of CSS property/value pairs in a semicolon-separated list, surrounded by curly braces. Many CSS properties are available, such as text-align, text-decoration, and so forth. You can assign values to those properties by listing those values after a property name, like this, in a rule specification:

{text-align: center; text-decoration: underline}

You saw in Part II that you can create block-level elements by using the CSS display property when you assign the value block to it. Block elements are displayed on their own lines. If you don't make an element a block element, it will be an inline element by default; inline elements are arranged by the browser following the normal flow of items that the browser displays.

In Part II you took a look at various text properties, such as those for selecting fonts, font size, font weight, text alignment, indentation, and decoration. And you also saw how to specify colors, backgrounds, and borders and even how to display images. CSS is also good at positioning elements, in both absolute and relative terms.

There are various ways to connect a CSS to an XML document. The most usual in XML documents is by using the <?xml-stylesheet?> processing instruction. This example ties an XML document to a CSS by using that processing instruction:

<?xml version="1.0" standalone="yes"?>
<?xml-stylesheet type="text/css" href="dickens.css"?>
<document>
    <title>Bleak House</title>
    <author>Charles Dickens</author>
    <chapter>1</chapter>
    <paragraph>
London. Michaelmas term lately over, and the Lord Chancellor sitting in
Lincoln's Inn Hall. Implacable November weather. As much mud in the streets
as if the waters had but newly retired from the face of the earth, and it
would not be wonderful to meet a Megalosaurus, forty feet long or so,
waddling like an elephantine lizard up Holborn Hill. Smoke lowering down
from chimney-pots, making a soft black drizzle, with flakes of soot in it
as big as full-grown snowflakes—gone into mourning, one might imagine, for
the death of the sun. Dogs, undistinguishable in mire. Horses, scarcely better;
splashed to their very blinkers. Foot passengers, jostling one another's
umbrellas in a general infection of ill temper, and losing their foot-hold
at street-corners, where tens of thousands of other foot passengers have been
slipping and sliding since the day broke (if this day ever broke), adding new
deposits to the crust upon crust of mud, sticking at those points tenaciously
to the pavement, and accumulating at compound interest.
    </paragraph>
    <paragraph>
Fog everywhere. Fog up the river, where it flows among green aits and meadows;
fog down the river, where it rolls deified among the tiers of shipping and the
waterside pollutions of a great (and dirty) city. Fog on the Essex marshes,
fog on the Kentish heights. Fog creeping into the cabooses of collier-brigs;
fog lying out on the yards and hovering in the rigging of great ships; fog
drooping on the gunwales of barges and small boats. Fog in the eyes and throats
of ancient Greenwich pensioners, wheezing by the firesides of their wards; fog
in the stem and bowl of the afternoon pipe of the wrathful skipper, down in his
close cabin; fog cruelly pinching the toes and fingers of his shivering little
'prentice boy on deck. Chance people on the bridges peeping over the parapets
into a nether sky of fog, with fog all round them, as if they were up in a
balloon and hanging in the misty clouds.
    </paragraph>
    <paragraph>
Gas looming through the fog in divers places in the streets, much as the sun
may, from the spongey fields, be seen to loom by husbandman and ploughboy.
Most of the shops lighted two hours before their time—as the gas seems to
know, for it has a haggard and unwilling look.
    </paragraph>
</document>

Here's an example of a style sheet, dickens.css, that specifies exactly how to format each of the various elements in the XML document by using one style rule for each element type:

title {display: block; font-size: 36pt; font-weight: bold;
    text-align: center; text-decoration: underline}
author {display: block; font-size: 16pt;
    text-align: center}
chapter {display: block; font-size: 28pt; text-align: center;
    font-style: italic}
paragraph {display: block; margin-top: 10}