Earlier in the chapter we have shown XML displayed in hte browser as a tree structure while the browser stated that “This XML file does not appear to have any style information associated with it. The document tree is shown below.” Now CSS is a friendly language, so take a look at the following:
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css" href="card1.css"?>
<card>
<name>Niels Müller Larsen</name>
<title>Lektor, MSc</title>
<email>nml@eaaa.dk</email>
<uri>deformation.org, eaaa.eu, x15.dk</uri>
<phone>+45 7228 6317</phone>
<logo uri="nml.png"/>
</card>
name {
font-size: 1.5em;
margin-top: 1.5cm;
margin-left: .75cm;
}
title, email, phone, uri {
margin-left: .75cm;
}
card {
background-image: url(x1.png);
background-repeat: no-repeat;
background-position: right;
background-color:white;
border: 1px solid black;
font-family:Arial, Helvetica, sans-serif;
font-size: 16px;
height: 179px;
width: 444px;
}
* {
display:block;
}
See the parsed result in your browser
What do we need HTML5 for? ;)