Styling XML document with CSS

In order an XML document would be displayed properly by a browser, the browser has to be instructed how to process your tags in the document. One possible way to do it is to use the CSS schema to style the tags.

In order to attach a style file to the XML document add the following line:

<?xml version="1.0" encoding="ISO-8859-1" standalone="yes/no" ?>
<?xml-stylesheet type="text/css" href="URL"?>

The URL must point to the CSS definition file that provides a style for each tag used.

Example of a styled XML document:

<?xml version="1.0"?>
<?xml-stylesheet type="text/css" href="job.css"?>
<job-posting>
    <title>
    Job Title: Webmaster
    </title>

    <description>
    We are looking for a Webmaster to oversee the management of
    our company website. The Webmaster will be responsible for working
    with other staff members to collect information for the Website, and
    for creating and maintaining the Web pages.
    </description>

    <skills>
    Expected skills:
    <skill>Basic writing skills</skill>
    <skill>Good communication skills</skill>
    <skill>HTML</skill>
    </skills>
</job-posting>

The file job.css contains the following style definitions:

description  { background-color: yellow;
               display: block;
               border: solid;
               margin-top: 20px;
               margin-bottom: 20px;
             }

skills       { background-color: yellow;
               display: block;
               border: solid;
               color: blue;
             }

skill        { display: list-item;
               margin-left: 1cm;
               list-style: square;
             }

title        { font-weight: bold;
               font-size: 24px;
               color: red;
             }

Show the result