Пример
Устанавливает контур вокруг элемента:<html>
<head>
<meta charset="utf-8" />
<style>
p { border:1px solid red; outline:green dotted thick; }
</style>
</head>
<body>
<p><b>Примечание:</b> Internet Explorer 8 (и выше) поддерживает свойство outline
если указан !DOCTYPE.</p>
</body>
</html>
Определение и использование
outline это линия, которая обращается вокруг элементов (вне границ), чтобы выделить элемент.
Сокращенное свойство контура устанавливает все свойства контура в одной декларации.
Свойства, которые могут быть установлены (в порядке):
Если одно из перечисленых выше значений отсутствует, например "outline:solid #ff0000;", значение по умолчанию отсутствующего свойства будет внесено, если имеется.
| Значение по умолчанию: | invert none medium |
|---|---|
| Унаследованный: | нет |
| Версия: | CSS2 |
| Синтакс JavaScript: | object.style.outline="#0000FF dotted thin" |
Поддержка браузеров
Свойство outline поддерживается во всех ведущих браузерах.
Примечание: Internet Explorer 8 (и выше) поддерживает свойство outline если указан !DOCTYPE.
Советы и примечания
Outline это линия вокруг элемента. Она показывается вокруг поля элемента. Тем не менее, она отличается от свойства border.
Контур не является частью размеров элемента, поэтому свойства ширины и высоты элемента не включают ширину контура.
Значения свойства
| Значение | Описание |
|---|---|
| outline-color | Указывает цвет контура. Смотрите outline-color для возможных значений |
| outline-style | Указывает стиль контура. Смотрите outline-style для возможных значений |
| outline-width | Указывает ширину контура. Смотрите outline-width для возможных значений |
| inherit | Указывает, что значение контура должно быть унаследовано от родительского элемента |

