Porte Aperte sul Web , navigazione veloce.
menu principale | contenuto principale | menu secondario
Benvenuti in Porte Aperte sul Web, Comunità di Pratica per l'accessibilità dei siti scolastici - USR Lombardia

Porte Aperte sul Web [logo]. Link alla home page


servizi
chi siamo | mappa | guida | faq | contatti

menu principale

sei in home - tutorial - home page con xhtml strict - lezione 6


contenuto principale

home page con xhtml strict

Lezione 6 - La barra orizzontale

barra orizzontale

Il codice commentato

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.

lezione precedente - sommario - lezione successiva


menu secondario
Creative Commons License
I contenuti di questo sito, salvo diversa indicazione, sono rilasciati sotto una licenza Creative Commons License.
Tutti i marchi sono proprietà dei rispettivi proprietari