Управление вёрсткой страниц

Для задания параметров страниц (размеров, ориентации, полей) и вёрстки документов предусмотрено специальное правило @page и ряд свойств. Например, для задания страницы размера А4 в книжной ориентации с полями 2 см следует задать правило

@page {size:210mm 297mm; margin:2cm}

Браузеры автоматически разделяют страницы на левые (left) и правые (right), используя механизмы псевдоклассов. Это позволяет, например, задавать зеркальные поля:

@page:left {

margin-left: 2cm;

margin-right: 1cm

}

@page:right {

margin-left: 1cm;

margin-right: 2cm

}

Таблица 2.12. Свойства управления вёрсткой страниц
Свойство	Описание	Умолчание	Применение
size	Размер страницы	auto	К странице
margin	Поля		К странице
page-break-before	Переход на новую страницу перед элементом	auto	К блочным элементам
page-break-after	Переход на новую страницу после элемента	auto	К блочным элементам
page-break-inside	Переход на новую страницу внутри элемента	auto	К блочным элементам

Размер страницы

size:Rv|auto|portrait|landscape

• portrait - книжная ориентация,

• landscape - журнальная ориентация.

Переход на новую страницу

page-break:auto|always|avoid|left|right

• always - обязательный принудительный переход,

• avoid - избегать перехода в данной позиции,

• left - переход с добавлением при необходимости пустых страниц, чтобы следующая была левая,

• right - переход с добавлением при необходимости пустых страниц, чтобы следующая была правая.

Управление интерфейсом

В CSS предусмотрена возможность управления видом курсора и динамическим выделением объектов. Динамическое выделение выполняется с помощью свойств outline-width/style/color. Все доступные значения параметров для outline-свойств такие же, как у свойств border.

Таблица 2.13. Свойства управления интерфейсом
Свойство	Описание	Умолчание
cursor	Вид курсора	auto
outline-width	Ширина границы	medium
outline-color	Цвет границы	invert
outline-style	Тип границы	none

Вид курсора

cursor:auto|crossheir|default|pointer|move|X-resize|text|wait|help|URI

• auto - браузер определяет вид курсора по контекту,

• crossheir - перекрестье,

• default - курсор по умолчанию,

• pointer - "указательный палец",

• move - перемещаемый объект,

• X-resize - курсор, показывающий перемещение границы объекта (изменение размера), где Х:

  • e - левая граница,

  • ne - верхний левый угол,

  • n - верхняя граница,

  • nw - верхний правый угол,

  • w -правая граница,

  • sw - нижний правый угол,

  • s - нижняя граница,

  • se - нижний левый угол.

• text - текстовый курсор,

• wait - курсор ожидания,

• help - справка,

• URI - адрес ресурса, содержащего изображение курсора.