Взглянем ближе на HTML
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugiat, tempora!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugiat, tempora!</p>
Что означает конструкция <p> ?
В языке HTML Такая конструкция называется тег. Ранее мы уже видели несколько тегов <section>, <h1>. Теги оборачивают наш контент и в итоге обрабатываются браузерами.
Все рассмотренные нами теги являются парными, так как имеют открывающую и закрывающую часть. В примере выше мы можем видим <h1>Some title</h1>.
<h1> — является открывающей частью тега.
</h1> — является закрывающей частью тега.
А между открывающей и закрывающей частью тега мы, обычно располагаем контент.
<hr> <!-- Вариант 1 -->
<hr /> <!-- Вариант 2 -->
<br> <!-- Вариант 1 -->
<br /> <!-- Вариант 2 -->
В примере выше явно видно то что кроме парных тегов в HTML есть и одиночные теги, такие теги не имеют закрывающей части. Обычно они используются для создания элементов которые отображают контент другим образом нежели парные теги.
<section>
<h2>Some another title</h2>
<p>Lorem ipsum dolor sit amet.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing.</p>
<hr>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab
excepturi incidunt maxime odio sint? Commodi cupiditate modi nesciunt
pariatur tempore?
</p>
</section>
Ключевой особенностью тегов является то что мы можем вкладывать их друг в друга, это хорошо видно из примера выше. Таким образом мы можем выстраивать более сложные композиции тегов и создавать более сложные системы.
<ul>
<li>Lorem ipsum.</li>
<li>At, maxime!</li>
<li>Dolores, recusandae.</li>
</ul>
В некоторых случаях вложенность является обязательной частью разметки текста. В примере выше, браузер не сможет интерпретировать теги
<li> и их внутренний контент правильным образом, если теги
<li> не будут вложены внутрь тега
<ul>.