Extensible Markup Language

Objectives

In this session, you will learn to:

Transform an XML document through a Cascading Style Sheet
Transform an XML document through Extensible Style Sheet
Language

Ver. 1.0 Session 5 Slide 1 of 33

Extensible Markup Language
Introducing Cascading Style Sheet

A CSS is a text file containing one or more rules or

definitions for the style characteristics of a particular
element.
It controls how tags are formatted in XML and HTML
documents.
The CSS file can be included in XML documents with the
same data structure.

Ver. 1.0 Session 5 Slide 2 of 33

Extensible Markup Language
Creating CSS

The syntax for coding a CSS is:

elementname specifies the
elementname { name of the element.
property1: value;
property2: value;
}

Ver. 1.0 Session 5 Slide 3 of 33

Extensible Markup Language
Creating CSS (Contd.)

The syntax for coding a CSS is:

property1 and property2
elementname { specify the property names,
property1: value; such as font-family, font-size,
and color
property2: value;
}

Ver. 1.0 Session 5 Slide 4 of 33

Extensible Markup Language
Creating CSS (Contd.)

The syntax for coding a CSS is:

value specifies the property
elementname { values for a property name.
property1: value;
property2: value;
}

For example, to display the film title in red, you can

type the following code in a CSS file:
FILM {COLOR: RED}

Ver. 1.0 Session 5 Slide 5 of 33

Extensible Markup Language
Applying CSS

A CSS can be applied to an XML

document using the following syntax:
<?xml:stylesheet type="text/css" Instructs the browser that the
href="path-name"?> XML document uses a
stylesheet.

Ver. 1.0 Session 5 Slide 6 of 33

Extensible Markup Language
Applying CSS (Contd.)

A CSS can be applied to an XML

document using the following syntax:
<?xml:stylesheet type="text/css" Specifies the type of
href="path-name"?> formatting that is being used.

Ver. 1.0 Session 5 Slide 7 of 33

Extensible Markup Language
Applying CSS (Contd.)

A CSS can be applied to an XML

document using the following syntax:
<?xml:stylesheet type="text/css" Specifies the name of the
href="path-name"?> CSS file used to format the
XML document.

Ver. 1.0 Session 5 Slide 8 of 33

Extensible Markup Language
Demo: Creating a CSS

Problem Statement:
Jim, the XML developer at CyberShoppe, has been asked to
display the product details for Cybershoppe in a browser in the
following format:
The price per unit, description, and quantity on hand for each
product should be displayed in teal, with a font size of 10 pts.
The product name should be displayed in red, with a font size of
20 pts. It should be displayed in bold.
All details should be displayed in the Arial font.

Ver. 1.0 Session 5 Slide 9 of 33

Extensible Markup Language
Introducing XSL

CSS does not support the reorder, sort, and display of

elements based on a condition.
For such advanced formatting, XML supports Extensible
Style Sheet Language (XSL).
XSL has two parts:
XSL Transformations (XSLT)
XML Path (XPath)
XSL:
Contains instructions on how an XML document should be
transformed into an HTML or an XHTML document.
Uses XPath expressions to extract specific data from an XML
document.
The XSLT processor transforms the XML document into an
HTML or XHTML or into another XML document.

Ver. 1.0 Session 5 Slide 10 of 33

Extensible Markup Language
Analyzing the Working of the XSLT Processor

The XSLT processor applies the transformation information

to the source document and builds the result tree as shown
in the following figure.

MSXML Parser

XSLT style sheet XSLT tree

XSLT Result tree

processor

XML document Source tree

Ver. 1.0 Session 5 Slide 11 of 33

Extensible Markup Language
Formatting Data Using XSLT

XSLT provides the following elements to select and format

data:
stylesheet
value-of
for-each
sort
text

Ver. 1.0 Session 5 Slide 12 of 33

Extensible Markup Language
Formatting Data Using XSLT (Contd.)

XSLT provides the following elements to select and format

data:
Instructs the browser that the document is a style
stylesheet sheet file.
value-of Is the root element for all XSLT style sheets.
for-each Is written as:
<xsl:stylesheet
sort xmlns:xsl=
text "http://www.w3.org/1999/XSL/Transform"
version="1.0">

Ver. 1.0 Session 5 Slide 13 of 33

Extensible Markup Language
Formatting Data Using XSLT (Contd.)

XSLT provides the following elements to select and format

data:
stylesheet
value-of Displays the value of the specified element or
attribute.
for-each
Follows the syntax:
sort <xsl:value‑of
text select="elementname/attributename"/>

Ver. 1.0 Session 5 Slide 14 of 33

Extensible Markup Language
Formatting Data Using XSLT (Contd.)

XSLT provides the following elements to select and format

data:
stylesheet
value-of
for-each Instructs the XSLT processor to process the
information for each instance of the specified pattern.
sort
Follows the syntax:
text <xsl:for-each select="pattern">
[action to be performed]
</xsl:for-each>

Ver. 1.0 Session 5 Slide 15 of 33

Extensible Markup Language
Formatting Data Using XSLT (Contd.)

XSLT provides the following elements to select and format

data:
stylesheet
value-of
for-each
sort Sorts data based on the values assigned to elements
text and
attributes.
Follows the syntax:
<xsl:sort select="expression"
order="ascending | descending"
case-order="upper-first | lower-first“
data-type="text | number | qname"/>

Ver. 1.0 Session 5 Slide 16 of 33

Extensible Markup Language
Formatting Data Using XSLT (Contd.)

XSLT provides the following elements to select and format

data:
stylesheet
value-of
for-each
sort
text Generates constant text in the output and displays
labels.
Follows the syntax:
<xsl:text> Text to be displayed as
label </xsl:text>

Ver. 1.0 Session 5 Slide 17 of 33

Extensible Markup Language
Formatting Data Using XSL Formatting Objects

XSL Formatting Objects (XSL-FO):

Is an XML-based language that formats XML documents into
pages, paragraphs, and lists.
Provides various objects and properties that define the
formatting of XML objects.
Provides a basic document structure that contains the
formatting objects and properties.

Ver. 1.0 Session 5 Slide 18 of 33

Extensible Markup Language
Formatting Data Using XSL Formatting Objects (Contd.)

The following code snippet depicts the structure of an XML

document:
Is <?xml version="1.0" encoding="ISO-8859-1"?>
<fo:root
xmlns:fo="http://www.w3.org/1999/XSL/Format">
<fo:layout-master-set>
<fo:simple-page-master master-name="A4">
<!-- Page template goes here -->
</fo:simple-page-master>
</fo:layout-master-set>
<fo:page-sequence master-reference="A4">
<!-- Page content goes here -->
</fo:page-sequence>
</fo:root>

Ver. 1.0 Session 5 Slide 19 of 33

Extensible Markup Language
Formatting Data Using XSL Formatting Objects (Contd.)

The XSL-FO objects provides a logical layout to an XML

document.
The content of an XML document can be split into pages.
These pages are divided into following four areas:
Regions: Are the topmost areas in the page.
Block areas: Are the block level elements.
Line areas: Contain the text within the block areas.
Inline areas: Are part of line areas.

Ver. 1.0 Session 5 Slide 20 of 33

Extensible Markup Language
Formatting Data Using XSL Formatting Objects (Contd.)

The XSL-FO properties specifies the type of formatting that

can be specified on the XSL-FO objects.
Consider the following code-snippet:
<fo:simple-page-master master-name="right">
<fo:region-body margin-left="5in"
margin-right="2in"/>
</fo:simple-page-master> This element defines a template
with the name right.

This specifies that the left margin

of the template is set to 5 inches.

This specifies that the right margin

of the template is set to 2 inches.

Ver. 1.0 Session 5 Slide 21 of 33

Extensible Markup Language
Creating XSLT Template Rules

A template rule:
Describes how an XML element and its contents are converted
into a specific format for displaying in the browser.
Consists of two parts:
A pattern that identifies an XML element in an XML document.
An action or processing code that details the transformation and
rendering of the resulting element.
XSLT uses two main elements for creating template rules:
template
apply-templates

Ver. 1.0 Session 5 Slide 22 of 33

Extensible Markup Language
Creating XSLT Template Rules (Contd.)

A template rule:
Describes how an XML element and its contents are converted
into a specific format for displaying in the browser.
Consists of two parts:
A pattern that identifies an XML element in an XML document.
An action or processing code that details the transformation and
rendering of the resulting element.
XSLT uses two main elements for creating template rules:
template Defines a template for the desired
apply-templates output.
Follows the syntax:
<xsl:template match="pattern">
[action to be taken]
</xsl:template>

Ver. 1.0 Session 5 Slide 23 of 33

Extensible Markup Language
Creating XSLT Template Rules (Contd.)

A template rule:
Describes how an XML element and its contents are converted
into a specific format for displaying in the browser.
Consists of two parts:
A pattern that identifies an XML element in an XML document.
An action or processing code that details the transformation and
rendering of the resulting element.
XSLT uses two main elements for creating template rules:
template
apply-templates Instructs the XSLT processor to find an
appropriate template and perform the specified
tasks on selected elements.
Follows the syntax:
<xsl:apply‑templates
[select="pattern"]>

Ver. 1.0 Session 5 Slide 24 of 33

Extensible Markup Language
Demo: Creating an XSLT Style Sheet to Format Data

Problem Statement:
CyberShoppe needs to display product details, such as product
ID, name, and price per unit. The following figure depicts a
sample output.

The details about the products should be displayed in red.

Ver. 1.0 Session 5 Slide 25 of 33

Extensible Markup Language
Practice Questions

The various departments of a university store data in

different formats. The IT department of the university
decides to use XML as the data interchange format to
transmit the data between the departments. Which of the
following would be the best approach to accomplish the task
using XML?
a. Devise a common information model and enforce its use by all
the departments that need to exchange data.
b. Implement a conversion application that can handle the data
received from other departments.

Ver. 1.0 Session 5 Slide 26 of 33

Extensible Markup Language
Practice Questions (Contd.)

c. Use an XSLT style sheet to convert the incoming or outgoing

XML document into the format used within the departments.
d. Modify the XML schema to use the same content model in all
departments.

Answer:
c. Use an XSLT style sheet to convert the incoming or outgoing
XML document into the format used within the departments.

Ver. 1.0 Session 5 Slide 27 of 33

Extensible Markup Language
Practice Questions

Which of the following code snippets can be used in an

XML document named Test.xml to associate it with a
style sheet named Test.css?
a. <?xml-stylesheet href="Test.css"
type="text/css"?>
b. <?xml-stylesheet href="Test.xsl"
type="text/css"?>
c. <?xmlstylesheet href="Test.css"
type="text/xsl"?>
d. <xml-stylesheet href="Test.css"
type="text/css"/>

Answer:
a. <?xml-stylesheet href=”Test.css”
type=”text/css”?>

Ver. 1.0 Session 5 Slide 28 of 33

Extensible Markup Language
Practice Questions

Consider the following statements:

Statement A: CSS can be used to reorder, add, delete, or
perform other operations on elements.
Statement B: CSS uses less memory when compared to
XSLT.
Which of the following is correct about the preceding
statements?
a. Statement A is True, and Statement B is False.
b. Statement A is False, and Statement B is True.
c. Both, Statement A and Statement B, are True.
d. Both, Statement A and Statement B, are False.

Answer:
b. Statement A is False, and Statement B is True.

Ver. 1.0 Session 5 Slide 29 of 33

Extensible Markup Language
Practice Questions

Which element must contain one or more when elements?

a. xsl:if
b. xsl:for-each
c. xsl:sort
d. xsl:choose

Answer:
d. xsl:choose

Ver. 1.0 Session 5 Slide 30 of 33

Extensible Markup Language
Practice Questions

Consider the following statements:

Statement A: XSLT is a superset of the CSS functionality.
Statement B: XSLT is an application of XML.
Which of the following is correct about the preceding
statements?
a. Statement A is True, and Statement B is False.
b. Statement A is False, and Statement B is True.
c. Both, Statement A and Statement B, are True.
d. Both, Statement A and Statement B, are False.

Answer:
c. Both, Statement A and Statement B, are True.

Ver. 1.0 Session 5 Slide 31 of 33

Extensible Markup Language
Summary

In this session, you learned that:

Rendering is the process of formatting and presenting the data
in an XML document in different formats.
A style sheet is a document that contains the formatting rules
for one or several XML documents. The two types of style
sheets that can be used with XML documents are:
CSS
XSL
CSS is used to define the style or appearance of an XML
document.
XSL is made up of XSLT and XPath.
XSLT is used to display selective elements or attributes, sort
data on one or more elements, and process the data based on
conditions.

Ver. 1.0 Session 5 Slide 32 of 33

Extensible Markup Language
Summary (Contd.)

The XSLT processor applies the transformation information

contained in the XSLT style sheet and builds a resultant tree
structure, which is then rendered to various targets.
XSLT elements, such as template, apply-templates,
sort, for-each, and value-of are used to extract and
format data.
XSL-FO provides formatting objects to break XML documents
into pages, paragraphs, and lists. The associated properties of
the formatting objects allow you to format the XML documents.
A template rule describes how an XML element and its
contents are converted into a format that can be displayed in
the browser.

Ver. 1.0 Session 5 Slide 33 of 33