Attach CSS StyleSheet To XML Document

Video tutorial illustrating: attaching css stylesheet to XML document to give better appearance to it on the browser. In short: for presentation purpose.

To achieve this, we need to first create a stylesheet file, and attach it or associate our XML file with this stylesheet. We do it with the help of a processing instruction.

Processing Instruction

you can give absolute or relative path in href.

This tells the XML parser that the attached css file has to be referenced while rendering the XML file content.

Complete code
companyNames.xml




  IBM, Oracle, Apple, Maestro, Microsoft ..

Stylesheet code
Style.css

companyName
{
    font-family: Verdana;
    font-size: 18px;
    color: red;
}

This way we have separated the content and styling information and made it into two separate files.
Helps keep the XML and Design/CSS coding separate and we could hire separate teams to work on these things.

Video Tutorial: Attach CSS StyleSheet To XML Document

YouTube Link: https://www.youtube.com/watch?v=7WH6dMI_cfE [Watch the Video In Full Screen.]

Output on the browser:
IBM, Oracle, Apple, Maestro, Microsoft ..

Output will have red color with 18px size and with font-family of verdana.