HTML и CSS - Box model

Page / - Изменено Alexandr Fokin в 2023/01/06 17:07

Box model

Изменено Alexandr Fokin

в 2023/01/06 17:07

Оглавление

padding - от контента до границы border - граница margib - от границы
box-sizing - свойство определяет как суммируется и определяются размеры контента и отступы. default: content-box - ширина и высота принминяются на контент, а отступы накладываются дополнительно(увеличивая итоговый болок) height = content_height weight = content_weight отдельно padding border margin padding-box - в значение ширины и высоты включается padding height = content_height + 2*padding weight = content_weight + 2*padding отдельно margin (Размер контента меньше height и weight)
border-box - в значение ширины и высоты включается padding и border height = content_height + 2*padding + 2*border weight = content_weight + 2*padding + 2*border отдельно margin (Размер контента меньше height и weight) Если контент будет превышать значение content_size, то он будет вылезать за границы.