HTML организован как коллекция дочерних и родительских элементов. В предыдущем упражнении вы поместили тэг <p> внутрь тега <body>. Когда один элемент находится внутри другого элемента, он считается дочерним.
Дочерний элемент всегда вложен в родительский элемент.
<body>
<p>This paragraph is a child of the body</p>
</body>
В примере выше элемент <p> является дочерним элементом <body>. А элемент <body> является родителем элемента <p>. Для того чтобы легче было ориентироваться в таком «фамильном дереве», каждый дочерний элемент отделяйте отступом относительно родителя.
Можно организовывать многоуровневый уровень вложенности. Любой элемент может являться родителем для одного и прародителем для другого элемента. Взаимосвязь между родительскими и дочерними элементами более часто называется иерархией элементов.
<body>
<div>
<h1>Один уровень вложенности с p, является дочкой div</h1>
<p>Один уровень вложенности с h1, является дочкой div</p>
</div>
</body>
В этом примере <body> является родителем <div> и прародителем <h1> и <p>. Элементы <h1> и <p> являются дочками элемента <div>.
Понимание HTML иерархии очень важно, потому-что дочерние элементы могут наследовать поведение и стилистику у своих родителей. Вы изучите больше о иерархии когда столкнётесь с таблицами CSS.
Инструкции
- Добавьте следующий параграф в качестве дочернего элемента <div>.
<p>Этот параграф является дочерним div элемента. body является прародителем данного параграфа</p>