Размещение на странице
Группа правил Box определяет свойства прямоугольного блока, соответствующему выбранному элементу на Web-странице. Если такого блока как бы нет, к примеру, в случае со строками обычного текста, то он создается в принудительном порядке (рис. 5.30).
Мы как бы заключаем текст внутрь прямоугольного контейнера, наподобие ячейки таблицы. При этом доступны следующие параметры:
□ Width — ширина блока.
□ Height — высота блока. Оба параметра — ширину и высоту можно задавать в различных единицах измерения, список которых приводится после текстового поля для выбранного параметра.
□ Float — определяет, является ли элемент "плавающим". Если задать вариант left или right, то объект, к которому применили стиль, считается "плавающим". Такой объект сдвигается влево или вправо, пока не встретит границу другого блочного объекта либо страницы. Подряд идущие "плавающие" объекты выстраиваются рядом друг с другом. К примеру, если сделать "плавающими" два подряд идущих абзаца, то они, если позволит ширина страницы, выстроятся рядом, а не друг под другом, как это происходит в обычном HTML (рис. 5.31).
|
Рис. 5.31. "Плавающие" объекты выстраиваются друг за другом, не "плавающие" — располагаются один под другим, каждый на новой строке (чтобы отделить "плавающие" блоки текста друг от друга, использовался параметр Margin со значением 5 пикселов) |
□ Clear — запрещает элементу "обтекание" предыдущего "плавающего" объекта. Это означает, что он должен располагаться под "плавающим" объектом, а не рядом с ним на одной строке. Можно запретить "обтекать" объекты слева (вариант left в списке Clear), справа (вариант right) или с обеих сторон (вариант both). Разумеется, использование этого параметра имеет смысл только при наличии "плавающих" элементов.
□ Padding — группа параметров, которая задает отступы между содержимым блока и его границами (рис. 5.32). Параметры Top, Right, Bottom, Left соответственно задают размеры для отступа от верхней, правой, нижней и левой границ блока. Чтобы задать одинаковые отступы, отметьте опцию Same for AD.
□ Margin — похожая по действию группа одноименных параметров, но она задает отступы между границами блока и другими элементами страницы (рис. 5.33).
|
Рис. 5.32. Параметры Padding определяют отступы между содержимым блока и его границами: слева — обычный блок со значениями Padding по умолчанию, справа — тот же блок с увеличенными параметрами Padding |
|
Рис. 5.33. Параметры Margin определяют отступы между внешними границами блока и его соседями: вверху — строка "обычных" плавающих блоков со значениями Margin по умолчанию, внизу — та же строка с увеличенными параметрами Margin |
|
Рис. 5.34. Правила из группы Border определяют оформление рамки вокруг объекта: сверху — обычный текст, снизу — тот же текст с рамкой, полученной под воздействием стиля CSS, в котором были заданы правила для группы Border |
