css властивість outline-color

CSS властивість outline-color задає колір зовнішнього контуру елемента.

На відміну від кордону елемента (наприклад, встановлено за допомогою кордону або пов'язаних з ним властивостей), контур елемента не займає зайвого місця, і може бути не прямокутним.

Контур завжди знаходиться над блоком, і це не впливає на положення чи розмір елементу або інших елементів

правити

Порада

Завжди оголошуйте властивість outline-style перед властивістю outline-color. Спочатку ви маєте визначити тип контуру, а вже потім змінювати його колір.

автор: Svitlana правити

Порада

Для задання контуру зручніше використовувати універсальну властивість outline.

автор: Svitlana правити

+ додати пораду чи нотатку

Синтаксис

outline-color: invert|color|initial|inherit;

Властивість outline-color може отримувати 4 значень:

invert

Виконує інверсію кольору. Контур буде видно, незалежно від кольору фону. Без задання.

автор: Svitlana

правити

color

Колір контуру в будь-якому допустимому для CSS форматі.

автор: Svitlana

правити

initial

Встановлює цю властивість в значення без задання.

автор: Svitlana

правити

inherit

Успадкує значення від батьківського елемента.

автор: Svitlana

правити

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
<колір>	1.0	1.5	1.2	7.0	12.0	8.0
invert	Не підтримується	Не підтримується	Не підтримується	Не підтримується	12.0	9.0

Підтримка: мобільні переглядачі

Переглядач
<колір>	2.1	1.0	3.2
invert	Не підтримується	Не підтримується	Не підтримується

Приклади

+ запропонувати свій приклад у пісочниці

<p>Абзац із крапчастим зеленим контуром.</p>

p {
    outline-style: dotted;
    outline-color: #00ff00;
    margin: 12px;
}