<?xml-stylesheet?> Instruction Examples

Examples of the <?xml-stylesheet?> instruction in HTML 5

Include an <?xml-stylesheet?> processing instruction between the xml declaration and the DOCTYPE declaration. The xml-stylesheet is included for older browsers. It serves the same purpose as the HTML <link> tag with type="application/xslt+xml" for HTML version 5, which should also be included:

index.html
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="/site-template.xsl"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
   <head>
      <link rel="stylesheet" type="application/xslt+xml" href="/site-template.xsl"/>
      <title>Example Only</title>
   </head>
   <body>
      <h1>Here Is Your Heading</h1>
      <p>This is the first paragraph of your web page.
      </p>
   </body>
</html>
site-template.xsl
<xsl:stylesheet version="1.0"
   xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
   xmlns:html="http://www.w3.org/1999/xhtml"
   xmlns="http://www.w3.org/1999/xhtml"
   exclude-result-prefixes="xsl html"
>
   <xsl:output method="html" version="1.0"
      omit-xml-declaration="no"
      doctype-system="about:legacy-compat"
   />

<!-- This is the "Fix for IE" based on the example in W3C's FAQs:
   http://www.w3.org/MarkUp/2004/xhtml-faq#ie
-->

   <xsl:template match="/html:html/html:head">
      <xsl:copy>
         <xsl:apply-templates select="@*"/>
         <!-- Workaround for Microsoft Bug #s 636728 and 572123
            X-UA-Compatible meta is ignored when inside conditional comments
         -->
         <meta http-equiv="X-UA-Compatible" content="IE=9"/>
         <xsl:apply-templates select="node()"/>
      </xsl:copy>
   </xsl:template>

   <xsl:template match="/html:html/html:body">
      <xsl:copy>
         <xsl:apply-templates select="@*"/>
         <p>This header comes from a template in the style sheet.</p>
         <xsl:apply-templates select="node()"/>
         <p>This footer also comes from the style sheet template.</p>
      </xsl:copy>
   </xsl:template>

   <xsl:template match="@*|node()">
      <xsl:copy>
         <xsl:apply-templates select="@*|node()"/>
      </xsl:copy>
   </xsl:template>

</xsl:stylesheet>