この例は, 単純DTDに適合する文書をXHTML[XHTML]に変換するためのスタイルシートとする。そのDTDを次に示す。
<!ELEMENT doc (title, chapter*)> <!ELEMENT chapter (title, (para|note)*, section*)> <!ELEMENT section (title, (para|note)*)> <!ELEMENT title (#PCDATA|emph)*> <!ELEMENT para (#PCDATA|emph)*> <!ELEMENT note (#PCDATA|emph)*> <!ELEMENT emph (#PCDATA|emph)*>
スタイルシートを次に示す。
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns="http://www.w3.org/TR/xhtml1/strict">
<xsl:strip-space elements="doc chapter section"/>
<xsl:output
method="xml"
indent="yes"
encoding="iso-8859-1"
/>
<xsl:template match="doc">
<html>
<head>
<title>
<xsl:value-of select="title"/>
</title>
</head>
<body>
<xsl:apply-templates/>
</body>
</html>
</xsl:template>
<xsl:template match="doc/title">
<h1>
<xsl:apply-templates/>
</h1>
</xsl:template>
<xsl:template match="chapter/title">
<h2>
<xsl:apply-templates/>
</h2>
</xsl:template>
<xsl:template match="section/title">
<h3>
<xsl:apply-templates/>
</h3>
</xsl:template>
<xsl:template match="para">
<p>
<xsl:apply-templates/>
</p>
</xsl:template>
<xsl:template match="note">
<p class="note">
<b>NOTE: </b>
<xsl:apply-templates/>
</p>
</xsl:template>
<xsl:template match="emph">
<em>
<xsl:apply-templates/>
</em>
</xsl:template>
</xsl:stylesheet>
次の入力文書を用いる。
<!DOCTYPE doc SYSTEM "doc.dtd"> <doc> <title>Document Title</title> <chapter> <title>Chapter Title</title> <section> <title>Section Title</title> <para>This is a test.</para> <note>This is a note.</note> </section> <section> <title>Another Section Title</title> <para>This is <emph>another</emph> test.</para> <note>This is another note.</note> </section> </chapter> </doc>
それは, 次の結果を生成する。
<?xml version="1.0" encoding="iso-8859-1"?> <html xmlns="http://www.w3.org/TR/xhtml1/strict"> <head> <title>Document Title</title> </head> <body> <h1>Document Title</h1> <h2>Chapter Title</h2> <h3>Section Title</h3> <p>This is a test.</p> <p class="note"> <b>NOTE: </b>This is a note.</p> <h3>Another Section Title</h3> <p>This is <em>another</em> test.</p> <p class="note"> <b>NOTE: </b>This is another note.</p> </body> </html>
次の例は，三つの異なるXSLTスタイルシートを使用して，XMLで表現されるデータを変換し，そのデータの三つの異なる表現，HTML，SVG及びVRMLを生成する。
入力データを次に示す。
<sales>
<division id="North">
<revenue>10</revenue>
<growth>9</growth>
<bonus>7</bonus>
</division>
<division id="South">
<revenue>4</revenue>
<growth>3</growth>
<bonus>4</bonus>
</division>
<division id="West">
<revenue>6</revenue>
<growth>-1.5</growth>
<bonus>2</bonus>
</division>
</sales>
次のスタイルシートは，[2.3 スタイルシートとしてのリテラル結果要素]に示す簡素化した構文を使用しており，データをHTMLに変換する。
<html xsl:version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
lang="en">
<head>
<title>Sales Results By Division</title>
</head>
<body>
<table border="1">
<tr>
<th>Division</th>
<th>Revenue</th>
<th>Growth</th>
<th>Bonus</th>
</tr>
<xsl:for-each select="sales/division">
<!-- order the result by revenue -->
<xsl:sort select="revenue"
data-type="number"
order="descending"/>
<tr>
<td>
<em><xsl:value-of select="@id"/></em>
</td>
<td>
<xsl:value-of select="revenue"/>
</td>
<td>
<!-- highlight negative growth in red -->
<xsl:if test="growth < 0">
<xsl:attribute name="style">
<xsl:text>color:red</xsl:text>
</xsl:attribute>
</xsl:if>
<xsl:value-of select="growth"/>
</td>
<td>
<xsl:value-of select="bonus"/>
</td>
</tr>
</xsl:for-each>
</table>
</body>
</html>
HTML出力を次に示す。
<html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Sales Results By Division</title> </head> <body> <table border="1"> <tr> <th>Division</th><th>Revenue</th><th>Growth</th><th>Bonus</th> </tr> <tr> <td><em>North</em></td><td>10</td><td>9</td><td>7</td> </tr> <tr> <td><em>West</em></td><td>6</td><td style="color:red">-1.5</td><td>2</td> </tr> <tr> <td><em>South</em></td><td>4</td><td>3</td><td>4</td> </tr> </table> </body> </html>
次のスタイルシートは, データをSVGに変換する。
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns="http://www.w3.org/Graphics/SVG/SVG-19990812.dtd">
<xsl:output method="xml" indent="yes" media-type="image/svg"/>
<xsl:template match="/">
<svg width = "3in" height="3in">
<g style = "stroke: #000000">
<!-- draw the axes -->
<line x1="0" x2="150" y1="150" y2="150"/>
<line x1="0" x2="0" y1="0" y2="150"/>
<text x="0" y="10">Revenue</text>
<text x="150" y="165">Division</text>
<xsl:for-each select="sales/division">
<!-- define some useful variables -->
<!-- the bar's x position -->
<xsl:variable name="pos"
select="(position()*40)-30"/>
<!-- the bar's height -->
<xsl:variable name="height"
select="revenue*10"/>
<!-- the rectangle -->
<rect x="{$pos}" y="{150-$height}"
width="20" height="{$height}"/>
<!-- the text label -->
<text x="{$pos}" y="165">
<xsl:value-of select="@id"/>
</text>
<!-- the bar value -->
<text x="{$pos}" y="{145-$height}">
<xsl:value-of select="revenue"/>
</text>
</xsl:for-each>
</g>
</svg>
</xsl:template>
</xsl:stylesheet>
SVG出力を次に示す。
<svg width="3in" height="3in"
xmlns="http://www.w3.org/Graphics/SVG/svg-19990412.dtd">
<g style="stroke: #000000">
<line x1="0" x2="150" y1="150" y2="150"/>
<line x1="0" x2="0" y1="0" y2="150"/>
<text x="0" y="10">Revenue</text>
<text x="150" y="165">Division</text>
<rect x="10" y="50" width="20" height="100"/>
<text x="10" y="165">North</text>
<text x="10" y="45">10</text>
<rect x="50" y="110" width="20" height="40"/>
<text x="50" y="165">South</text>
<text x="50" y="105">4</text>
<rect x="90" y="90" width="20" height="60"/>
<text x="90" y="165">West</text>
<text x="90" y="85">6</text>
</g>
</svg>
次のスタイルシートは, データをVRMLに変換する。
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<!-- generate text output as mime type model/vrml, using default charset -->
<xsl:output method="text" encoding="UTF-8" media-type="model/vrml"/>
<xsl:template match="/">#VRML V2.0 utf8
# externproto definition of a single bar element
EXTERNPROTO bar [
field SFInt32 x
field SFInt32 y
field SFInt32 z
field SFString name
]
"http://www.vrml.org/WorkingGroups/dbwork/barProto.wrl"
# inline containing the graph axes
Inline {
url "http://www.vrml.org/WorkingGroups/dbwork/barAxes.wrl"
}
<xsl:for-each select="sales/division">
bar {
x <xsl:value-of select="revenue"/>
y <xsl:value-of select="growth"/>
z <xsl:value-of select="bonus"/>
name "<xsl:value-of select="@id"/>"
}
</xsl:for-each>
</xsl:template>
</xsl:stylesheet>
VRML出力を次に示す。
#VRML V2.0 utf8
# externproto definition of a single bar element
EXTERNPROTO bar [
field SFInt32 x
field SFInt32 y
field SFInt32 z
field SFString name
]
"http://www.vrml.org/WorkingGroups/dbwork/barProto.wrl"
# inline containing the graph axes
Inline {
url "http://www.vrml.org/WorkingGroups/dbwork/barAxes.wrl"
}
bar {
x 10
y 9
z 7
name "North"
}
bar {
x 4
y 3
z 4
name "South"
}
bar {
x 6
y -1.5
z 2
name "West"
}