Основные элементы языка HTML

1. Блочные элементы (block elements)

Некоторые элементы HTML, которые могут присутствовать внутри элемента body, называются «блочными элементами» (или элементы уровня блока), в то время как другие - «внутренние» (элементы уровня текста).

1.1. Заголовки

Существует шесть уровней заголовков - от h1 (наиболее важный) до h6 (наименее важный). Все заголовки имеют полужирное начертание и вертикальные отступы. Элемент blockquote создает блок с вертикальными и горизонтальными отступами. В этом элементе могут содержаться как строчные, так и блочные элементы. Примеры заголовков:

Заголовок 1 уровня

Заголовок 2 уровня

Заголовок 3 уровня

Заголовок 4 уровня

Заголовок 5 уровня
Заголовок 6 уровня

1.2. Элементы p и div

Элемент p создает параграф. В нем не могут содержаться элементы уровня блока (включая и сам элемент p). Также нежелательно использовать пустой элемент p, так как браузеры игнорируют пустые элементы p.

Элемент p добавляет вертикальный отступ перед и после абзаца. Применяется параграф для облегчения чтения текста и логической группировки связанных по смыслу предложений.

Элемент div может содержать как внутренние элементы, так и блочные и применяется для структурного разделения документа. Крайне часто применяется при верстке страниц с применением CSS, что дало ей определение «блочная».

Наряду с элементом в будущем div будет часто использоваться элемент span для форматирования частей строк.

1.3. Форматирование текста с помощью элемента pre

Элемент pre сообщает визуальным агентам пользователей, что пробельные символы внутри не нужно сокращать и переносить по ним длинные строки. Очень не рекомендуется применять в элементе символ табуляции. В элементе могут находиться только строчные элементы. 
          ____
        o8%8888,
      o88%8888888.
     8'-    -:8888b
    8'         8888
   d8.-=. ,==-.:888b
   >8 `~` :`~' d8888
   88         ,88888
   88b. `-~  ':88888
   888b ~==~ .:88888
   88888o--:':::8888
   `88888| :::' 8888b
   8888^^'       8888b
  d888           ,%888b.
 d88%            %%%8--'-.
/88:.__ ,       _%-' ---  -
    '''::===..-'   =  --.  `

2. Подстановки

Подстановки используются в тех случаях, когда использование обычных символов невозможно, либо нужно заменить признак тега на графические символы угловых скобок. В тексте обязательной замене подлежат открывающая угловая скобка и амперсанд. Желательно заменять закрывающую угловую скобку, одиночные и двойные кавычки. Пример: фрагмент кода <h2 class="center"> Голландская фирма Horns&Hoofs запустила online-магазин </h2>

3. Элементы строчного уровня (inline elements)

3.1. Непосредственное и логическое форматирование текста

3.1.1. Изменение размера и положения текста с помощью элементов sub и sup

Формула расчета энергии: E=mc2
Химическая формула воды: H2O

3.1.2. Изменение начертания и гарнитуры

Используется для текста, который по разным причинам отличается от обычного текста Используется для привлечения внимания к тексту, не указывая на то, что это более важно Используется для разметки текста, который должен отличаться стилистически от обычного текста

3.1.3. Смысловые элементы («phrase elements»)

Предназначен для текста, имеющего особое значение или на который следует сделать акцент Элемент сильной значимости указывает на то, что его содержание имеет большое значение, серьезность или срочность Цитата или ссылка на другие ресурсы Фрагмент компьютерного кода