← Все вопросы
Чем div отличается от span и когда что использовать?
5
Везде в коде вижу кучу <div> и иногда <span>. Вроде оба ничего сами по себе не делают. В чём между ними разница и зачем они вообще нужны, если они «пустые»?
2 ответа
10
✓ Принятый ответ — помог автору
Оба — это «контейнеры без собственного смысла», нужны, чтобы группировать и потом оформлять через CSS. Разница в поведении:
<div>— блочный: занимает всю ширину строки, следующий элемент идёт с новой строки. Используется для крупных кусков: шапка, колонка, карточка.<span>— строчный: занимает ровно столько места, сколько занимает его содержимое, и сидит внутри строки текста. Используется, чтобы выделить кусочек внутри текста.
<div>Это целый блок на всю ширину</div>
<p>Обычный текст, а вот <span style="color:red">это слово</span> красное.</p>
Правило: div — обернуть область, span — выделить часть строки.
3
Дополню: не лепи div'ы повсюду. Если есть подходящий смысловой тег — бери его. Например, для навигации <nav>, для статьи <article>, для шапки <header>. div и span — это когда подходящего по смыслу тега нет.
Ваш ответ
Войдите, чтобы ответить на вопрос.