sei in home - tutorial - home page con xhtml strict - lezione 6
Con il Foglio di Stile definiamo le caratteristiche del box #barra.
Scarica il file barra.css e leggi il codice corrispondente.
#barra {
font-weight: bold;
color: #FFFFFF;
text-align: center;
border: 1px solid #0066CC;
background-image: url(images/quadrblu1.gif);
background-repeat: repeat;
}
Il testo viene definito in grassetto, di colore bianco, allineato al centro e su sfondo immagine quadrettato blu scuro (quadrblu1.gif), ripetuto. Il box avrà il bordo largo 1 pixel, continuo e di colore blu.
Si noti come la separazione tra contenuto e presentazione, permetta di delegare al solo Foglio di Stile la definizione delle caratteristiche del box. Il codice xhtml risulta così molto più comprensibile e leggero, mentre le possibilità di modifica stilistica vengono affidate ad un solo file.