Свойство outline-offset указывает расстояние между рамкой и краем границы элемента.
Свойство outline-offset не является частью сокращенного свойства outline. Оно должно быть указано отдельно.
| Значение по умолчанию | 0 |
| Применяется | Ко всем элементам. |
| Наследуется | Нет |
| Анимируемое | Да. Ширина пространства анимируема. |
| Версия | CSS3 |
| DOM синтаксис | object.style.outlineOffset = "20px"; |
Синтаксис
outline-offset: length | initial | inherit;Пример
<!DOCTYPE html>
<html>
<head>
<title>Заголовок документа</title>
<style>
div.ex1 {
margin: 20px;
border: 2px dotted #000;
background-color: #8ebf42;
outline: 4px solid #666;
outline-offset: 10px;
}
</style>
</head>
<body>
<h2>Пример свойства outline-offset</h2>
<div class="ex1">Значение свойства outline-offset равно 10px</div>
</body>
</html>В этом примере расстояние между рамкой и границей равно 10px.
Значения
| Значение | Описание |
|---|---|
| length | Пространство между рамкой и краем границы элемента. Значение по умолчанию - 0. |
| initial | Устанавливает свойство в значение по умолчанию. |
| inherit | Значение элемента наследуется от родительского элемента. |
Поддержка браузера
|
|
|
|
|
|---|---|---|---|---|
| 1.0+ | 15.0+ | 1.5+ | 1.2+ | 9.5+ |
Практикуйте свои знания
Что такое CSS свойство 'outline-offset'?
Правильный!
Неправильно!