HTML: Hierarki

Et HTML dokument er ligesom et familietræ. Et html element kan have en eller flere børn eller en forælder. Fra sin forælder arver man egenskaber som f.eks. CSS farver osv! Derfor er det altså ikke nok bare at læse et dokument fra toppen til bunden, men man skal også lægge mærke til om et element ligger inden i et andet element.

//CSS
#Jens {
    color: red;
}
<!-- HTML -->
<div id="Jens">
    <p> Min forælder er Jens</p>
    <p> Min forælder er også Jens</p>
</div>

Min forælder er Jens

Min forælder er også Jens

I et eksemplet ovenfor kan du se et <div> element som har 2 <p> elementer som børn. Som du kan se har begge arvet farven rød fra "Jens".
Det er meget almindeligt at bruge indrykning så HTML nemmere kan læses. Altså indrykker man børn en enkelt gang mere en deres forælder.