Блочная модель CSS
Блочная модель - это способ отображения элементов браузерами, которые обрабатывают все теги как небольшие прямоугольные блоки. Для браузеров любой тег - это контейнер с содержимым: текстом, изображениями, другими тегами и т.д.
- Margin (внешний отступ) - это пустое пространство (поле), которое отделяет один элемент от другого или от края области просмотра окна браузера. Самый простой пример внешнего отступа - это промежуток между абзацами, идущими друг за другом.
Область внешнего отступа прозрачна и не может иметь свой цвет и других эффектов оформления.
- Border (рамка элемента) - это граница с любой стороны элемента. Рамка может быть установлена как со всех сторон элемента, так и с одной стороны.
Используя рамку можно просто красиво оформить элемент или визуально отделить содержимое текущего элемента от других элементов страницы.
- Padding (внутренний отступ) - это пустое пространство между содержимым элемента и его рамкой.
Область внутреннего отступа прозрачна и не может иметь свой цвет или другие эффекты оформления.
- У большинства элементов есть область содержимого, в которой располагается все содержимое элемента (текст, вставляемые изображения или вложенные (дочерние) элементы).
С этой темой смотрят: