Formatting XML with CSS

It is possible to format XML file to format with CSS as we format HTML files. We can write style definitions for XML in the same way we write stylesheet for HTML.

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

<?xml version=”1.0″ encoding=”ISO-8859-1″?>

<?xml-stylesheet type=”text/css” href=”xml_css.css”?>

<!– DTD declration –>
<!DOCTYPE tutorial [
<!ELEMENT ebiz (tutorial+,info)>
<!ELEMENT tutorial (category,title,author,url,launch_date)>
<!ATTLIST tutorial category (cc|ll|ul) #REQUIRED>
<!ELEMENT category (description?,sub_category?)>
<!ELEMENT launch_date (date,month,year)>
<!ENTITY developer “[email protected]”>
<!ENTITY copyright “www.csitquestions.com, All right Reserved, 2016”>
]>

<CSITQuestion>
<tutorial category=”cc”>
  <category>
    <description>Computer Courses</description>
    <sub_category>Tutorial group: Scripting Language</sub_category>
  </category>
  <title>Tutorial Name :XML</title>
  <author></author>
  <url>URL :- http://www.csitquestions.com/html/xml/</url>
  <launch_date>
    <date>25</date>
    <month>April</month>
    <year>2016</year>
  </launch_date> </tutorial>
<info>Author: &developer; <br />©right; </info>
</CSITQuestion>

The second line, <?xml-stylesheet type=”text/css” href=”xml_css.css?>, links the XML file to the CSS file, that containts the following code:

/* CSS to format XML document*/
ebiz
{
    border: #000099 thin solid;
    width:500;
    height:400;
/*background-color:cyan;*/
    margin-left:0;
    margin-top:0;
    margin-right:0;
    margin-bottom:0;
}

tutorial
{
    display:block;
    margin-left:0 px;
    width:500;
    height:150;
    background-color:pink
}

category
{
    display:block;
    margin-left:12;
    font-family:”Courier New”, Courier, monospace;
    color:#0000FF;
}

description
{
    display:block;
    margin-left:12;
    font-weight:400;
    color:#9933FF
}

title
{
    display:block;
    font-weight:bolder;
    margin-left:16;
}
url
{
    text-decoration:underline;
    color:blue;
    display:inline;
    margin-left:16;
}

sub_category
{
    display:inline;
    margin-left:20;
    font-weight:bolder;
    color:red;
    margin-left:16;
}

br
{
    display:block;
}
info
{
    display:block;
    margin-left:25;
    width:300;
    border:#996600 medium solid;
    font-style:italic;
    margin-top:200;
    padding-top:2;
}

launch_date
{
display:block;
margin-left:16;
}