Свойства границ боксовой модели CSS

Что такое боксовая модель в CSS? Боксовая модель CSS представляет собой прямоугольный элемент, который изображает структуру страницы. Эта модель сама состоит из четырёх элементов margin, border, padding и контент. Каждый из этих элементов имеет свою собственную ширину и высоту.

Задавая высоту и ширину при помощи языка стилей CSS, следует указывать только разделы зоны содержимого. Для того, чтобы вычислить полный размер элемента, к существующим размерам добавляются внешние и внутренние отступы, а также рамка. Чтобы написать код CSS для элемента определённого формата в пикселях, нужно прописать в коде цифрами его данные margin, padding, border и так далее. Просматривая результат в браузере IE, можно заметить как написанный в коде элемент вмещает границы в ширину и padding, которую указал администратор, если при этом он не указал Doctype. Можно добавить в код doctype.

Тип рамки вокруг элемента определяет свойство border style. Ширину рамки задаёт свойство border-width, свойство border-color, соответственно, задаёт цвет рамки. Такие же свойства присущи и отображению внешней границы — outline.