XML Document Without CSS :

<?xmlversion="1.0"encoding="UTF-8"standalone="yes"?>
<Students>
    <Student>
        <Name>Ra.One</Name>
        <Address>New Delhi</Address>
    </Student>
    <Student>
        <Name>Krishh</Name>
        <Address>New Mumbai</Address>
    </Student>
</Students>

Above is the sample XML document. This XML document will looks like -
XML without CSS

Steps to Apply CSS to XML Document

Step 1 : Create XML

Create Sample XML File same like shown above. (Say Student.xml)

Step 2 : Create CSS File

Now create CSS file with following content and write save it as “Student.css”.

Students
{
font-family:verdana,helvetica,sans-serif;
}
Name
{
display:block;
font-weight:bold;
font-size  :18px; 
}
Address
{
font-size  :15px;
}

Step 3 : Include CSS file in the XML Document

Applying css to the XML document is much easy task. we need to include css

<?xml-stylesheet type="text/css" href="Student.css"?>

After Including above line in the XML document complete XML document will looks like -

<?xmlversion="1.0"encoding="UTF-8"standalone="yes"?>
<?xml-stylesheet type="text/css" href="Student.css"?>
<Students>
    <Student>
        <Name>Ra.One</Name>
        <Address>New Delhi</Address>
    </Student>
    <Student>
        <Name>Krishh</Name>
        <Address>New Mumbai</Address>
    </Student>
</Students>

Preview Of XML document in Browser After Applying CSS

XML After Applying CSS