div — блочный элемент, который обычно используется для группировки содержимого, структурирования макета страницы и занимает всю доступную ширину.
span — строчный элемент, используется для выделения или стилизации небольших частей текста, не создает разрывов строк и занимает только необходимую ширину.
Пример использования:
html
Основные отличия:
| Свойство | div | span |
|---|---|---|
| Тип отображения | Блочный (block) | Строчный (inline) |
| Ширина | Занимает всю доступную | По ширине содержимого |
| Новая строка | Создает перед и после | Не создает |
| Размеры | Можно управлять (width, height) | Нельзя напрямую управлять (width, height игнорируются) |
| Margin/Padding | Применяются полнее (top, right, bottom, left) | Вертикальные (top, bottom) margin/padding игнорируются, горизонтальные применяются |