Árbol jerárquico

Un documento HTML es un árbol jerárquico. Esto significa que cada elemento, excepto la raíz, tiene un solo elemento padre: el elemento que lo contiene. La raíz no tiene padre. Veamos una página sencilla:

<html>
   <head></head>
   <body>
      <p>Texto del documento</p>
      <p class="text">Una <span>palabra</span> destacada</p>
   </body>
</html>

Podemos representar esta página con el siguiente árbol jerárquico:

El esquema muestra cómo se anidan los elementos. En este ejemplo, el padre de span es p.text y el padre de p.text es body.

La estructura jerárquica del documento es la base de la herencia.