Динамические контуры Общее описание CSS допускает создание вокруг отображаемых элементов динамических контуров. Это удобно для выделения таких объектов, как кнопки, активные поля форм или карты ссылок. Контуры отличаются от рамок в двух отношениях: во-первых, они не занимают экранного пространства, во-вторых, не обязаны иметь прямоугольную форму. Отображение контура производится поверх окружающих элементов, непосредственно от края рамки данного элемента. Сценарии обеспечивают возможность динамического оконтуривания элементов. Кроме того, для этого можно использовать псевдоклассы :focus и :active. К сожалению, обозреватели пока не поддерживают перечисленных здесь свойств. Размер контура: свойство outline-width Синтаксис: outline-width: <размер-рамки> | inherit Начально: medium Применимо: ко всем элементам Наследуемо: нет Проценты: не используются Устройства: визуальные интерактивные Поддержка : Не поддерживается Не поддерживается Свойство outline-width задает размер динамического контура. Оно принимает те же значения, что и border-width. Пример: A:active { outline-width: thick } Стиль контура: свойство outline-style Синтаксис: outline-style: <стиль-рамки> | inherit Начально: none Применимо: ко всем элементам Наследуемо: нет Проценты: не используются Устройства: визуальные интерактивные Поддержка : Не поддерживается Не поддерживается Свойство outline-style задает стиль динамического контура. Оно принимает те же значения, что и border-style. Пример: A:focus { outline-style: double } Цвет контура: свойство outline-color Синтаксис: outline-color: <цвет> | invert | inherit Начально: invert Применимо: ко всем элементам Наследуемо: нет Проценты: не используются Устройства: визуальные интерактивные Поддержка : Не поддерживается Не поддерживается Свойство outline-color задает цвет динамического контура. Его значениями могут быть любые цвета, а также invert, что означает, что цвет контура должен быть получен обращением цветов пикселей экрана. Пример: A:focus { outline-color: red } Свойства контура: свойство outline Синтаксис: outline: [ <outline-width> || <outline-style> || <outline-color> ] | inherit Начально: см. индивидуальные свойства Применимо: ко всем элементам Наследуемо: нет Проценты: не используются Устройства: визуальные интерактивные Поддержка : Не поддерживается Не поддерживается Свойство outline задает размер, стиль и цвет контура одновременно. Если какое-то из этих свойств не задано, то принимается его начальное значение. Пример: A:active { outline: thick solid red } <<<  Назад  1  2  3  4  5  6   8  Комментарии к статье  8 8  Обсудить в чате

8  В тему Введение в таблицы стилей Селекторы, псевдоклассы и псевдоэлементы Значения свойств, каскадность и наследование Границы, заполнители и рамки Позиционирование элементов Цвет и фон Шрифты Текст Таблицы Генерация содержимого, нумерация и списки Страничные устройства вывода Звуковые таблицы стилей