border-color

Оновлено: 08.12.2022

border-color

Встановлює колір кордону на різних сторонах елемента. Властивість дає змогу задати колір кордону одразу для всіх сторін елемента або тільки для зазначених.

Коротка інформація

Значення за замовчуванням Значення властивості color
Успадковується ні
Застосовується До всіх елементів
Анімується Так

Синтаксис

border-color: [<цвет> | transparent]{1,4}

Значення

<колір> Див. колір.
transparent Встановлює прозорий колір

Дозволяється використовувати одне, два, три або чотири значення, розділяючи їх між собою пропуском. Результат залежить від кількості та зазначений у табл. 1.

Табл. 1. Зміна кольору залежно від числа значень

Число значеньРезультат
1Колір межі буде встановлено для всіх сторін елемента.
2Перше значення встановлює колір верхньої та нижньої межі, друге - лівої та правої.
3Перше значення задає колір верхньої межі, друге - одночасно лівої та правої межі, а третє - нижньої межі.
4По черзі встановлюється колір верхньої, правої, нижньої та лівої межі.



Приклад

Об'єктна модель

Об'єкт.style.borderColor

Примітка

Internet Explorer до версії 7.0 не підтримує значення transparent.

Колір кордону в різних браузерах може дещо відрізнятися під час використання значень стилю groove, ridge, inset або outset.


Браузери

border-color

Переглянути сумісність з Can I use?

border-color