XSLT Example

Here's an example of an XML document that has been transformed using XSLT.

Before...

We can take a raw XML file that looks something like this:

Raw XML file

After...

...and apply XSLT so that it looks something like this:

XML XSL example

You might have noticed that the "After" shot contains more than the raw XML file. It contains a heading (Cool Tutorials) and some text (Hey, check out these tutorials!).

This is one of the benefits of XSLT. The following lessons explain XSLT in more detail, and demonstrate how to apply XSLT to an XML document.

How to Do This?

Instead of linking to a CSS file (as we did in the XML with CSS lesson), this time we link to a XSL file.

  1. XML File

    Create an XML file with the following content and save it.

  2. XSL File

    Create a file with the following content and save it as tutorials.xsl into the same directory as the XML file.

This XSL file contains XSL markup, HTML markup, and CSS. The following lessons explain XSLT in more detail, and demonstrate how to apply XSLT to an XML document.