Applicare un foglio di stile CSS ad un file XML

Affrontiamo il primo metodo per formattare un file Xml, mediante l'utilizzo dei fogli di stile Css, utilizziamo all'interno del file Xml questa stringa per richiamare il foglio di stile esterno, ad esempio xmlstyle.css:

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

Ripetiamo per intero il codice della pagina Xml creata nella lezione precedente, il file index.xml, arricchendolo della nuova dichiarazione per includere il file Css esterno:

<?xml version="1.0"?>

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

<guestbook>
   <user>
      <nome>Pippo</nome>
      <email>webmaster@pippo.it</email>
      <homepage>http://www.pippo.it</homepage>
      <commento>Testo del commento al guestbook!</commento>
   </user>
   <user>
      <nome>Pluto</nome>
      <email>webmaster@pluto.it</email>
      <homepage>http://www.pluto.it</homepage>
      <commento>Altro commento al guestbook!</commento>
   </user>
   <user>
      <nome>Paperino</nome>
      <email>webmaster@paperino.it</email>
      <homepage>http://www.paperino.it</homepage>
      <commento>Terzo commento al guestbook!</commento>
   </user>
</guestbook>

Creiamo ora il file xmlstyle.css e lo posizioniamo nella stessa cartella del file Xml, utilizziamo i nomi dei Tag che abbiamo creato (inventato) e gli assegniamo delle caratteristiche di stile:

nome {
   display: Block;
   color: #FF0000;
   font: Bold 12px Verdana;
}
email, homepage {
   display: Block;
   color: #0000FF;
   font: Bold 12px Verdana;
}
commento {
   display: Block;
   color: #000000;
   font: Bold 12px Verdana;
   padding-bottom: 30px;
}

Potete ora visualizzare l'esempio di questa lezione.

Autore: Luca Ruggiero