Associating Stylesheets with XML Documents

CSS stylesheets are primarily intended for use in web pages. Web browsers find the stylesheet for a document by looking for xml-stylesheet processing instructions in the prolog of the XML document. This processing instruction should have a type pseudoattribute with the value text/css and an href pseudoattribute whose value is an absolute or relative URL locating the stylesheet document. For example, this is the processing instruction that attaches the stylesheet in Listing 12-2 (css) to the file in Example 12-1 (cornbread.xml) if both are found in the same directory. 

<?xml-stylesheet href="recipe.css"?>

Including the required type and href pseudoattributes, the xml-stylesheet processing instruction can have up to six pseudoattributes:

  • type
  • This is the MIME media type of the stylesheet; text/css for CSS and application/xml (not text/xsl!) for XSLT.
  • href
  • This is the absolute or relative URL where the stylesheet can be found.
  • charset
  • This names the character set in which the stylesheet is written, such as UTF-8 or ISO-8859-7. There's no particular reason this has to be the same as the character set in which the document is written. The names used are the same ones used for the encoding pseudoattribute of the XML declaration.
  • title
  • This pseudoattribute names the stylesheet. If more than one stylesheet is available for a document, the browser may (but is not required to) present readers with a list of the titles of the available stylesheets and ask them to choose one.
  • media
  • Printed pages, television screens, and computer displays are all fundamentally different media that require different styles. For example, comfortable reading on screen requires much larger fonts than on a printed page. This pseudoattribute specifies the media types this stylesheet should apply to. There are nine predefined values:
    • screen
    • tty
    • tv
    • projection
    • handheld
    • print
    • braille
    • aural
    • all

    xml-stylesheet processing instructions, each pointing to a different stylesheet and each using a different media type, you can make a single document attractive in many different environments.

  • alternate
  • This pseudoattribute must be assigned one of the two values yes or no. yes means this is an alternate stylesheet, not normally used. no means this is the stylesheet that will be chosen unless the user indicates that they want a different one. The default is no.

For example, this group of xml-stylesheet processing instructions could be placed in the prolog of the recipe document to make it more accessible on a broader range of devices: 

<?xml-stylesheet href="recipe.css" media="screen" alternate="no" title="For Web Browsers" charset="US-ASCII"?>
<?xml-stylesheet href="printable_recipe.css" media="print" alternate="no" title="For Printing" charset="ISO-8859-1"?>
<?xml-stylesheet href="big_recipe.css" media="projection" alternate="no" title="For presentations" charset="UTF-8"?>
<?xml-stylesheet href="tty_recipe.css" media="tty" alternate="no" title="For Lynx" charset="US-ASCII"?>
<?xml-stylesheet href="small_recipe.css" media="handheld" alternate="no" title="For Palm Pilots" charset="US-ASCII"?>