Home Programming Extensible Stylesheet Language (XSL)

Search

Extensible Stylesheet Language (XSL) Print
Written by Chris Gountanis   

The Extensible Stylesheet Language (XSL) is a family of languages which allows one to define how files encoded in the XML standard are to be formatted for display. XSL is developed to be XML data driven. XSL is a language for defining style sheets. An XSL style sheet is similar to a CSS file. An XSL is a file that defines how to display an XML document. XSL has similar functionality of CSS2. Styling required source XML documents with included information on how to display a document of a given type.

 

 XSL Added Functionality
  • XSL Formatting Objects (XSL-FO) which is a transformation language for XML documents. XSLT was intended to perform complex styling operations, like the creation of indexes and content tables. However, XSLT is now used as a general purpose XML processing language.
  • XSL Transformations includes advanced styling features using XML document type which defines formatting objects.
  • XML Path Language which is a non-XML language used by XSLT, and also used in non-XSLT contexts, for defining the sections of an XML document.

The following is a basic example of an XML document. The XSL below that will format the data as defined. The XSL is in a basic summary form. You can add styles for other areas like the pagination and margins as well as many other areas.
 

 

XML

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>

<?xml-stylesheet type="text/xsl" href="sample.xsl"?>

<animallist>

<animal>

<animalid>1</animalid>

<name>Rover</name>

<species>Canine</species>

<dob>3/2/2005</dob>

<gender>M</gender>

<customerid>1</customerid>

<color>Brown</color>

</animal>

<animal>

<animalid>2</animalid>

<name>Fluffy</name>

<species>Feline</species>

<dob>10/5/2004</dob>

<gender>F</gender>

<customerid>2</customerid>

<color>White</color>

</animal>

<animal>

<animalid>3</animalid>

<name>Beakie</name>

<species>Parrot</species>

<dob>1/1/1997</dob>

<gender>M</gender>

<customerid>3</customerid>

<color>Grey and White</color>

</animal>

<animal>

<animalid>4</animalid>

<name>Buster</name>

<species>Canine</species>

<dob>5/5/2003</dob>

<gender>F</gender>

<customerid>4</customerid>

<color>Tan</color>

</animal>

</animallist>

 

 

XSL

<?xml version="1.0" ?>

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:template match="/">

<html>

<head>

<title>Example of XSL</title>

<link href="styles.css" rel="stylesheet" type="text/css"/>

<script type="text/javascript" language="javascript">

</script>

</head>

<body>

<table border="0" cellpadding="1" cellspacing="0">

<tbody>

<tr><th class="appheader">Dropdown Example</th></tr>

<tr><td> </td></tr>

<tr><td>

<select name="animalid" id="animalid" class="apptext">

<xsl:for-each select="//animallist/animal">

<option>

<xsl:attribute name="value">

<xsl:value-of select="./animalid"/>

</xsl:attribute>

<xsl:value-of select="./name"/>, <xsl:value-of select="./species"/>

</option>

</xsl:for-each>

</select>

</td></tr>

</tbody>

</table>

</body>

</html>

</xsl:template>

</xsl:stylesheet>

 

  

CSS

body {

font-family: Arial, Helvetica;

background-color: #CCCCCC;

}

 

.appheader {

BACKGROUND-COLOR: #FFFFFF;

FONT-WEIGHT: bold;

FONT-SIZE: 10pt;

COLOR: #0000FF;

FONT-FAMILY: Arial;

}

 

.apptext {

background-color: #FFFF99;

FONT-WEIGHT: normal;

FONT-SIZE: 12pt;

COLOR: #990000;

FONT-FAMILY: Georgia, "Times New Roman", Times, serif;

}

 

  

EXAMPLE OUTPUT

 

Extensible Stylesheet Language XSL Example Output

 

 

Works Cited

w3 What is XSL? (n.d.). Retrieved from What is XSL?:

http://www.w3.org/Style/XSL/WhatIsXSL.html

Wikipedia Extensible Stylesheet Language. (n.d.). Retrieved from Extensible Stylesheet Language:

http://en.wikipedia.org/wiki/Extensible_Stylesheet_Language
Last Updated on Thursday, 31 January 2008 03:11