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

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

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

Заголовки

Существует шесть уровней заголовков - от 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. Изменение размера и положения текста

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

Химическая формула воды H2O

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

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

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

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

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

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

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

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

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

Перепечатка материала не преследуется по закону