Nei primi giorni di Internet, pagine Web contenuto misto e la formattazione nello stesso documento. E 'stato un semplice - approccio - se meno elegante. Le pagine Web che avevano più pannelli di contenuto, come intestazioni, piè di pagina e barre laterali, spesso utilizzati tavoli per controllare il layout. norme più recenti prescritti utilizzando div invece di tabelle per controllare il layout, che ha permesso la formattazione da controllare dall'esterno. E 'fatta per più pulita - carico e più veloce - contenuti.

Div wrapper Definito

In Web-parlare, un div è un elemento HTML, simile alla voce o tag di paragrafo. La differenza è che div sono per lo più utilizzati per "avvolgere" sezioni di contenuto, invece di essere contenuti stessi. Mentre ogni div può essere un involucro, in un uso convenzionale, il div wrapper è quello che contiene tutti gli altri contenuti su una pagina, compresi gli altri div.

CSS per il salvataggio

Molte pagine web moderne separano il contenuto dalla formattazione utilizzando fogli di stile CSS. file CSS ha dato programmatori la possibilità di specificare gli elementi di formattazione, come font e sfondi indipendentemente dal contenuto. Essa ha anche dato loro la possibilità di avere un controllo file CSS la formattazione di potenzialmente ogni pagina del sito. Modifica di un tipo di carattere è diventato semplice come aggiornamento di una sola riga nel foglio di stile.

Utilizzando il Wrapper

Si potrebbe utilizzare un div per racchiudere l'intestazione o il menu di navigazione. Il vantaggio di questo approccio è che è possibile assegnare un ID o di classe a quella involucro, che consente poi bersaglio e il suo contenuto invocando l'ID o il nome della classe nel CSS. È possibile avvolgere gli elementi di navigazione, per esempio, in un div e dargli la classe "menu". Poi, nel CSS, è possibile specificare gli attributi che si applicano solo al div "menu", e ignorare tutto il resto della pagina. Il tuo codice HTML potrebbe essere simile a questo:

<Div class = "menu">
... Il contenuto del menu va qui
</ Div>

Poi, nel CSS, è possibile lo stile che, in questo modo:

div.menu {... codice CSS va qui}