Свойство padding
Свойство padding задает внутренние отступы элемента - отступы от внешней границы элемента до его содержания.
Существует несколько способов записи свойства padding.
Обычный способ:
- padding-top: 5px;
- padding-right: 10px;
- padding-bottom: 15px;
- padding-left: 20px;
Сокращенный способ: padding: 5px 10px 15px 20px;
Кроме того, в зависимости от значений, последнюю запись можно еще сокращать.
Обратите внимание, что для строчных элементов вертикальные отступы не задаются.
Свойство margin
Свойство margin задает внешние отступы элемента - отступы от внешней границы элемента до границ родительского элемента или до соседних элементов.
Способы записи свойства margin аналогичны свойству padding.
Обратите внимание, что строчные элементы реагируют только на горизонтальные отступы.
Свойство border
Рамка задаётся с помощью свойства border, которое состоит из трёх компонентов: ширина рамки, стиль рамки, цвет.
Рамку можно задавать и строчным, и блочным элементам.
Свойство box-sizing
Свойство box-sizing изменяет алгоритм расчета размеров элемента:
- content-box - значение по умолчанию, соответствует стандартной блочной модели;
- border-box - изменяет режим расчета размеров элемента, при котором, например, свойство width задает не ширину содержимого, а ширину всего элемента, включая внутренние отступы и границы.
