<?xml-stylesheet?> Instruction Syntax
<?xml version="1.0" encoding="UTF-8"?> <?xml-stylesheet ...?> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> ... </html>
Rules for coding the xml-stylesheet instruction for HTML 5
Make sure you understand the difference between a tag and element and are familiar with the definitions of namespace and other HTML terms.
- The
xml-stylesheet
processing instruction is optional. Include axml-stylesheet
instruction with the same href attribute on all web pages that use the same set of web site templates. - It should be coded between the xml declaration and the DOCTYPE declaration.
- The processing instruction starts with the characters
<?
. - The tag name is
xml-stylesheet
. The name is in the HTML namespace, even if the namespace is not explicitly specified in the <html> tag. - The value of the type attribute should be
text/xsl
. - The href attribute should be a URL that references a valid style sheet.
- The processing instruction is terminated by the
?>
characters. - Processing instructions are self-closing tags and therefore do not have a corresponding end tag.
Style Sheet and Templates
<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:body"> <xsl:copy> <xsl:apply-templates select="@*"/> <p><#Template header code goes here.#></p> <xsl:apply-templates select="node()"/> <p><#Template footer code goes here.#></p> </xsl:copy> </xsl:template> <xsl:template match="@*|node()"> <xsl:copy> <xsl:apply-templates select="@*|node()"/> </xsl:copy> </xsl:template> </xsl:stylesheet>
Rules for coding the style sheet and site templates
- The main element of the stylesheet document is a stylesheet element. Code a starting
<xsl:stylesheet>
tag at the beginning of the document and an ending</xsl:stylesheet>
tag at the end of the document. The tag's element type name,stylesheet
, uses lower case letters and should be in the XSL namespace which will be associated with the namespace prefix before the element name (xsl
in our examples). - On the starting <stylesheet> tag, code the
version
attribute, which is required and indicates the version of XSLT that it to be used to interpret the style sheet and transform HTML documents. - Indicate the namespaces used in the style sheet and templates by coding a xmlns attribute with a prefix for each namespace and one without a prefix for the default HTML namespace. (For backward compatibility, the namespace from the 1999 W3C standard is used for all HTML versions from that year forward, including XHTML and HTML 5.) The style sheet will include at least two of the possible namespaces in HTML 5:
http://www.w3.org/1999/XSL/Transform
to reference the XSLT elementshttp://www.w3.org/1999/xhtml
to match HTML tags and generate HTML code
- Include an
exclude-result-prefixes="xsl html"
attribute in the starting <xsl:stylesheet> tag so that the only xmlns attribute on the <html> tag in the result document is the xmlns attribute without a prefix for the default HTML namespace. - Immediately after the starting
<stylesheet>
tag, code an output element. The tag's element type name,output
, uses lower case letters and should be in the XSL namespace which will be associated with the namespace prefix (xsl
) before the element name. Include amethod="html"
attribute on the element. Note: without the<output>
tag andmethod="html"
attribute, the DOM will be inconsistent between browsers. Specifically, in some browsers, such as Opera, thedocument
object will be an HTMLDocument while in other browsers, such as Firefox, thedocument
object will be a XMLDocument. Since some methods, such as getElementsByName are not supported on an XMLDocument object, certain JavaScript code will not work correctly when the output element or themethod="html"
attribute is omitted. - Inside the stylesheet element, between the starting
<stylesheet>
tag and ending</stylesheet>
tag, code the templates for the web site. For example, a template withmatch="/html:html/html:body"
can be included to add a header and footer to the HTML body section. - Include a template with an identity transform:
<xsl:template match="@*|node()"> <xsl:copy> <xsl:apply-templates select="@*|node()"/> </xsl:copy> </xsl:template>