CSS-свойство outline устанавливает ширину, стиль и цвет для всех четырех сторон контура элемента. Это короткое свойство для установки отдельных свойств outline-width, outline-style, и outline-color.
| Значение по умолчанию: | Индивидуальные CSS-свойства |
| Применяется к: | Все элементы |
| Наследование: | Нет |
| Анимирование: | Да, так как некоторые подсвойства являются анимируемыми. Анимируемые свойства |
| Версия: | CSS 2, 3 |
Синтаксис
Синтаксически свойства задаются по следующему шаблону:
outline: [ outline-width outline-style outline-color ] | initial | inheritЕсли какое-либо свойство, указанное выше, отсутствует или пропущено, будет добавлено значение по умолчанию для этого свойства, если оно есть.
Примеры написания кода свойства outline:
p.one {
outline: 2px solid #ff0000;
}
p.two {
color: #00ff00;
outline-top: 5px solid;
}Если outline-color отсутствует или не указан (например, outline: 5px solid;), вместо него будет использоваться значение свойства color элемента.
Но, если не указан outline-style, пропуск значения приведет к тому, что контур вообще не будет отображаться, поскольку значением по умолчанию для свойства outline-style является none.
Значения свойств
В следующей таблице описаны значения этого свойства.
| Значение | Описание |
|---|---|
outline-width |
Устанавливает ширину контура элемента. |
outline-style |
Устанавливает стиль линии контура элемента. |
outline-color |
Устанавливает цвет контура элемента. |
initial |
Устанавливает это свойство в значение по умолчанию. |
inherit |
Если указан, связанный элемент принимает вычисленное значение своего родительского элемента outline. |
Поддержка браузеров
Свойство outline поддерживается во всех основных браузерах.
Internet Explorer 7 и более ранние версии не поддерживают свойство outline. IE8, однако, поддерживает это свойство, но требует допустимого <!DOCTYPE>.
