0 Displaying XML Files with CSS

Displaying XML Files with

With CSS (Cascading Style Sheets) you can add display information to an XML document.

It is possible to use CSS to format an XML document.

Below is an Tutorial of how to use a CSS style sheet to format an XML document:

Take a look at this XML file:

Cd_catalog.xml


<?xml version="1.0" encoding="ISO-8859-1" ?>
<!--
-->
<CATALOG>
<CD>
<TITLE>Empire Builders</TITLE>
<ARTIST>Bob Dylan</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>Columbia</COMPANY>
<PRICE>10.90</PRICE>
<YEAR>1985</YEAR>
</CD>
<CD>
<TITLE>New Era Co</TITLE>
<ARTIST>John Dyke</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>CBS Records</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1988</YEAR>
</CD>
<CD>
<TITLE>Greatest Hits</TITLE>
<ARTIST>Doll7y Parton</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>RCA</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1982</YEAR>
</CD>
</CATALOG>


Then look at this stylesheet

CATALOG
{
background-color: #ffffff;
width: 100%;
}
CD
{
display: block;
margin-bottom: 30pt;
margin-left: 0;
}
TITLE
{
color: #FF0000;
font-size: 20pt;
}
ARTIST
{
color: #0000FFl
font-size: 20pt;
}
COUNTRY,PRICE,YEAR,COMPANY
{
display: block;
color: #000000
margin-left: 20pt;
}

Then look at this stylesheet

CATALOG
{
background-color: #ffffff;
width: 100%;
}
CD
{
display: block;
margin-bottom: 30pt;
margin-left: 0;
}
TITLE
{
color: #FF0000;
font-size: 20pt;
}
ARTIST
{
color: #0000FFl
font-size: 20pt;
}
COUNTRY,PRICE,YEAR,COMPANY
{
display: block;
color: #000000
margin-left: 20pt;
}


Finally, view the output

Below is a fraction of the XML file.The second line, <?xml-stylesheet type="text/css" href="cd_catalog.css"?>, links the XML file to the CSS file:


<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/css" href= "cd_catalog.css"?>
<CATALOG>
<CD>
<TITLE>Wwe empires</TITLE>
<ARTIST>John</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>Columbia</COMPANY>
<PRICE>10.90</PRICE>
<YEAR>1985</YEAR>
</CD>
<CD>
<TITLE>Empire Builders</TITLE>
<ARTIST>Bob Dylan</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>Columbia</COMPANY>
<PRICE>10.90</PRICE>
<YEAR>1985</YEAR>
</CD>
</CATALOG>