Elemente de baza ale unei pagini web: Document tree
O pagina web poate fi considerata ca un copac care poate contine orice numar de ramuri. Exista reguli in ceea ce priveste cate elemente poate contine fiecare ramura. Pentru a intelege conceptul de “document tree“, sa luam drept exemplu o pagina HTML simpla ce contine elemente generale:
<html>
<head><meta content=”text/html;
charset=UTF-8″ http-equiv=”Content-Type”/><title>Pagina mea</title>
</head>
<body>
<h1>Aceasta este pagina mea</h1>
<p>Pagina mea contine multe lucruri folositoare. Contine <em>text evidentiat</em> si
un citat:
</p><blockquote>
<p>Acesta este un citat.</p>
</blockquote><h2>Iata un sub-titlu</h2>
<p>Si cam asta este totul.</p>
<hr/>
</body>
</html>
Putem observa ca elementul html contine de fapt doua elemente: head si body. head contine doua sub-ramuri: un element meta si un element title. Elementul body contine cateva titluri, paragrafe, si un citat.
Observati faptul ca exista un fel de simetrie in felul in care tag-urile sunt deschise si inchise. De exemplu, paragraful care contine:
“Pagina mea contine multe lucruri folositoare…”
are mai multe elemente de text, al doilea fiind inclus intr-un element em (element evidentiat).
Paragraful este inchis dupa ce continutul s-a incheiat, dar inainte de a incepe urmatorul element din document tree (in acest caz este un element blockquote).
Pozitionand tag-ul de inchidere al elementului paragraf </p> dupa elementul blockquote am strica structura documentului.
