Il tad <div>, è un tag molto importante nella costruzione di una pagina html, il cui scopo è quello di dividere la nostra pagina in sezioni logiche a cui applicare un determinato stile , un determinato script o semplicemente raggruppare determinati elementi dalle caratteristiche comuni.
L’elemento div , altro non è che una sorta di contenitore per gli altri elementi (titoli, paragrafi, immagini) e di per se , non ha nessun risultato visibile, se non quello di andare a capo al termine del </div>.
Capiamolo con un esempio :
<!DOCTYPE html>
<html>
<body>
<div>
<p>Paragrado all’ interno del primo div </p>
</div>
<div>
<p>Paragrado all’ interno del secondo div</p>
</body>
</html>
Tag Div per applicare uno stile
Vediamo invece adesso cosa significa usare il tag div per applicare ad una porzione di pagina lo stesso stile.
<!DOCTYPE html>
<html>
<body>
<p>testo al di fuori del div</p>
<div style="background-color:pink;">
<h1>Titolo all’ interno del div</h1>
<p>Paragrado all’ interno del div</p>
</div>
<p>Testo fuori dal div</p>
<div style="color:red;">
<h1>Titolo all’ interno del secondo div</h1>
<p>Paragrado all’ interno del secondo div</p>
</body>
</html>
Come potete notare con il codice di questo esempio , abbiamo diviso il testo in due sezioni logiche:
- Una prima , dove indichiamo che in quella porzione il background deve essere di colore rosa
- Una seconda dove indichiamo che il testo del div dev’ essere di colore rosso.