Guida ai fogli di stile CSS - Corso base - Capitolo 9: i div. Riepilogo delle principali regole CSS

Capitolo 9: I div. Riepilogo delle principali regole CSS.

Un div è un contenitore generico.

Per la grande flessibilità di posizionamento e gestione dell'aspetto, i div ricoprono ormai un ruolo fondamentale nella creazione di pagine web.

La "scatola" div è composta da un bordo e dal contenuto; tra il bordo e il contenuto è possibile aggiungere dello spazio di padding, mentre tra il bordo e l'esterno del div è possibile aggiungere dello spazio, detto margin (margine).

La quantità di spazio per margin e padding non deve essere necessariamente la stessa per tutti e quattro i lati, ma può variare da lato a lato, come vedremo a breve in un esempio.

I div vanno a nozze con il concetto di classe, che verrà presentato nel prossimo capitolo, in quanto potremo specificare regole ad hoc per ciascun div o per gruppi di div di varie pagine all'interno del nostro foglio di stile; per il momento, ci limiteremo a dire che con un div è possibile utilizzare praticamente tutti i selettori mostrati fino a questo punto; quello che segue è un esempio (buono anche come riepilogo delle principali regole css, testo escluso) di possibile regola da applicare ad un div:

position: static;

width: 80%;

height: 800px;    /* opzionale in presenza di min-height */

min-height: 600px;

z-index: 1;

float: left;

color: white;

background-color: #000000;

background-image: url(./RES/immagineSfondo.jpg);

background-repeat: repeat-y;

padding: 10px;

margin-left: 0px;

margin-right: 0px;

margin-top: 4px;

margin-bottom: 0px;

text-align:center;

/* tutte le possibili combinazioni per i bordi, come visto nel capitolo precedente. */