Народ, всем привет. Когда мы говорим о верстке сайтов, одним из самых важных понятий в CSS является box model, ну или «модель коробки», она же блочная модель. Когда-то была табличная верстка, но свершилось чудо и мы от нее ушли. Теперь, всё, что вы видите на веб-странице, будь то абзац, кнопка, изображение или целый блок — всё это по сути прямоугольные коробки. Понимание того, как они устроены, позволяет избежать множества проблем, особенно связанных с "прыгающей" версткой, сломанными отступами и непредсказуемыми размерами элементов...

В языке HTML выделяют две основные категории элементов. данные категории соответствуют типам их содержимого и поведению в структуре веб-страницы. Это блочные и строчные элементы. Блочные элементы используются для создания структуры страницы. Строчные же используются для форматирования текстовых фрагментов веб-страницы. Весь HTML документ организован в виде дерева элементов. В то же время модель CSS представляет собой алгоритм, обрабатывающий HTML документ. Каждый блок в дереве — это соответствующий элемент или псевдоэлемент...