Тег <div> и тег <span>

Тег <div> и тег <span> не имеют свойств по умолчанию для внешнего отображения, они представляют собой так называемые контейнеры, поэтому к ним можно применять всевозможные CSS-стили, чтобы элементы внутри этих тегов приняли желаемый вид.

Тег <div> изначально был предназначен для деления веб-страницы на логические фрагменты, такие как нижний колонтитул (подвал), боковое меню и т.п. Но с появлением новой семантической разметки веб-страниц с помощью HTML5, необходимость в таком повсеместном использовании тега отпала.

В настоящее время тег <div> используется для группирования блочных элементов. Тег также позволяет объединять любой набор таких элементов, как заголовок, насколько абзацев, список в единственном блоке, который потом можно позиционировать на веб-странице, создавая сложную схему разметки.

Тег <div> следует применять только в случае, если для выделения области не подходит никакой другой элемент страницы.

Тег <span> применяется для выделения внутренних (inline) элементов, таких как отдельные слова и фразы, находящихся в пределах абзаца текста или заголовка.

С помощью тега <span> можно, например, выделить часть текста или слова другим шрифтом:

<p>Пример: HTML<span style="font-weight:bold; color:orange">5</span>BOOK</p>

Пример: HTML5BOOK