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

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

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

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

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

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

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

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

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

Заголовок 6 уровня
Элементы p и div

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

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

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

Наряду с элементом в будущем div будет часто использоваться элемент span для форматирования частей строк.
Форматирование текста с помощью элемента 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:.__ ,       _%-' ---  -
    '''::===..-'   =  --.  `
			
```

Подстановки

Подстановки используются в тех случаях, когда использование обычных символов невозможно, либо нужно заменить признак тега на графические символы угловых скобок. В тексте обязательной замене подлежат открывающая угловая скобка и амперсанд. Желательно заменять закрывающую угловую скобку, одиночные и двойные кавычки.

Основные подстановки:

< (открывающая угловая скобка)
> (закрывающая угловая скобка)
" (двойная кавычка)
' (одиночная кавычка)
& (амперсанд)

Пример: фрагмент кода

		
			<h2 class="center">
			Голландская фирма Horns&Hoofs запустила online-магазин
			</h2>

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

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

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

Формула расчета энергии: E=mc²

Химическая формула воды: H₂O

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

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

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

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

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

em: Предназначен для текста, имеющего особое значение или на который следует сделать акцент

strong: Элемент сильной значимости указывает на то, что его содержание имеет большое значение, серьезность или срочность

cite: Цитата или ссылка на другие ресурсы

code: Фрагмент компьютерного кода