Контур
Контур (Outline) предназначен для того, чтобы помочь посетителям сайта ориентироваться на нем, когда они переходят по интерактивным элементам с помощью клавиатуры. Контур, который появляется вокруг элемента, дает понять посетителю, что он взаимодействует с конкретным интерактивным элементом. Если посетитель сайта нажмет Tab на клавиатуре, контур появится вокруг следующего элемента, получившего фокус.
Контур имеет смысл добавлять для состояния элемента в фокусе (Focus).
Чтобы добавить контур элементу:
- Выберите элемент, для которого хотите добавить контур (это должен быть интерактивный элемент, например, поле формы или кнопка)
- Выберите для элемента состояние Фокус (Focus) на вкладке Стилей правой панели в разделе Состояние (State)
- Найдите на вкладке Стилей правой панели раздел Эффекты (Effects) и параметр Контур (Outline)
- Установите параметры контура
Контур виден только с отключенными направляющими (Shift+O).
Цвет — определяет цвет контура и его прозрачность.
Ширина – определяет толщину контура. По умолчанию устанавливается в пикселях (px), можно изменить единицу измерения.
Смещение — определяет расстояние между границей элемента и контуром. По умолчанию устанавливается в пикселях (px), можно изменить единицу измерения.
Стиль — определяет тип контура.
- Точечный (Dotted)
- Пунктирный (Dashed)
- Сплошной (Solid)
- Двойной (Double)
- Вдавленный посередине обводки (Groove)
- Выпуклый посередине обводки (Ridge)
- Вдавленный контур (Inset)
- Выпуклый контур (Outset)