Unul dintre cele mai folosite elemente in HTML este <div></div> (prescurtare de la document division).

Pana acum am vorbit despre elemente care dau un rost continutul, sau creaza o structura, dar nu si div-ul.

Div-ul este un element care nu are nici un rol semantic in HTML, exista doar pentru a grupa alte elemente.

De exemplu, inainte de HTML5 nu exista o metoda de a defini un element pentru un meniu, asa ca un web developer folosea un <div></div> care avea un atribut de tip id cu valoarea de meniu, si astfel definea rolul acestuia:

<div id="meniu">
    ...
</div>

In HTML5 (cea mai recente versiune a HTML) a aparut elementul de <nav></nav> care defineste clar ca o parte din web-site este un meniu. Si pe langa el au aparut o groaza de alte elemente care au inceput sa inlocuiasca functiile div-ului, asa ca importanta lui continua sa scada.

Dar in trecut, era unul dintre cele mai folosite elemente desi nu avea nici un rol. Acesta era foarte usor de folosit (si inca este) si aparea peste tot cand cineva vroia sa trateze cateva elemente impreuna.

Asa ca probabil div-ul inca este unul dintre cele mai intalnite elemente intr-o pagiona web.

Cand ar trebui sa se foloseasca tag-ul <div>

De exemplu, sa spunem ca vrem sa separam primele 2 paragrafe, pentru a le stiliza altfel. Asa ca le vom include intr-un div:

<div class="intro">
    <h1>Elementul de tip div</h1>
    <h2>Ce este si cand il folosim</h2>
</div>
<p>Elementul de tip div era pana de curand unul dintre cele mai des intalnite elemente intr-o pagina HTML.</p>
<p>Odata cu aparitia HTML 5, importanta lui a scazut, dar inca mai este foarte folosit pentru gruparea altor elemente in pagina.</p>

Acest <div> nu va schimba cu nimic modul in care este afisata pagina dar ne ajuta pe noi sa grupam cateva elemente impreuna (in acest caz primele doua paragrafe), pe care am vrea sa le tratam altfel.

Folosindu-ne de clasa intro putem stiliza cele doua paragrafe folosind CSS. Nu vom face asta acum, dar acesta este unul din rolurile acestui element.

Elementul <div> este unul de tip block, de aceea ar trebui folosit impreuna cu alte elemente de acelasi fel. Dupa cum am vazut mai devreme, cel mai adesea el este folosit pentru a grupa alte elemente block.

Nefiind un element de tip inline, el nu are cum sa apara in interiorul textului. Dar daca am vrea sa grupam doar cateva cuvinte impreuna putem folosi tag-ul <span>.