Поддержка сайта

Высокие позиции в поисковой системе, на прямую зависят от развития вашего сайта.

Продвижение сайтов

Эффективность стратегий продвижения подтверждается сотрудничеством с крупными клиентами и отзывами о нашей работе.

Создание сайтов

Мы делаем сайты быстро, недорого и профессионально. От работы с нами, у вас останутся только положительные эмоции.

Поля

.

Итак, вы уже знаете, как изменить размер блочного элемента, задать для него границу по своему вкусу и добавить дополнительные отступы, чтобы сместить содержимое элемента от края границы. Рассмотрим еще одно полезное CSS-свойство — margin.

Свойство margin позволяет задать величину свободного пространства снаружи от границы элемента. Единственная разница в CSS-коде для двух абзацев, показанных на рис. 4.23, — добавление свойства margin: 30 рх для второго из них.

Рис. 4.23. Разница между отступами и полями видна яснее, когда есть граница

Изменим поля для двух элементов: ul и h2. Различные браузеры задают разные значения по умолчанию для полей этих элементов. Не будем на них полагаться и зададим собственное значение 15рх, одинаковое для обоих элементов.

chapter4\websitefi1es\07_heading_padding\stylel.ess (фрагмент)

h2, ul

{ margin-top: 15px;

}

Блочная модель

Рассмотрим сейчас модель, похожую на вложенные коробки. Вид блочного элемента можно изменять, используя комбинацию свойств margin, border, padding, height и width. На рис. 4.24 показано, как можно представить их графически.

Рис. 4.24. Представление блочной модели

.

Читайте так же:
Not found