outline-offset
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2017.
CSS-свойство outline-offset
задаёт расстояние между обводкой и краем или рамкой элемента.
Интерактивный пример
Синтаксис
css
/* Значения <length> */
outline-offset: 3px;
outline-offset: 0.2em;
/* Глобальные значения */
outline-offset: inherit;
outline-offset: initial;
outline-offset: revert;
outline-offset: revert-layer;
outline-offset: unset;
Значения
Описание
Обводка — это линия вокруг элемента за пределами рамки. Расстояние между элементом и его обводкой прозрачно. Другими словами, оно будет таким же, как и фон родительского элемента.
Формальное определение
Начальное значение | 0 |
---|---|
Применяется к | все элементы |
Наследуется | нет |
Обработка значения | как указано, но с относительной длиной, конвертируемой в абсолютные длины |
Animation type | длина |
Формальный синтаксис
outline-offset =
<length>
Примеры
Расстояние обводки в пикселях
HTML
html
<p>Gallia est omnis divisa in partes tres.</p>
CSS
css
p {
outline: 1px dashed red;
outline-offset: 10px;
background: yellow;
border: 1px solid blue;
margin: 15px;
}
Результат
Спецификации
Specification |
---|
CSS Basic User Interface Module Level 4 # outline-offset |
Совместимость с браузерами
BCD tables only load in the browser