border-color
Поддержка браузерами
12.0+ | 4.0+ | 1.0+ | 1.0+ | 3.5+ | 1.0+ |
Описание
CSS свойство border-color задает цвет рамки для элемента. Можно использовать от 1 до 4 значений, разделяемых между собой пробелами. Цвет устанавливается начиная с верхней позиции. Если задано два цвета подряд, это значит первое значение для верхней и нижней границы, второе значение для правой и левой границы.
Пример:
-
border-color: red green blue pink;
- Верхняя рамка - красная
- Правая рамка - зеленая
- Нижняя рамка - синяя
- Левая рамка - розовая
-
border-color: red green blue;
- Верхняя рамка - красная
- Правая и левая рамка - зеленые
- Нижняя рамка - синяя
-
border-color: red green;
- Верхняя и нижняя рамка - красные
- Правая и левая рамка - зеленые
-
border-color: red;
- Все 4 рамки - красные
Примечание: свойство border-color используется только в паре с border-style, так как без него, оно не даст никакого эффекта.
Значение по умолчанию: | совпадает с цветом текста |
---|---|
Применяется: | ко всем элементам, а также к псевдо-элементу ::first-letter |
Анимируется: | да |
Наследуется: | нет |
Версия: | CSS1 |
Синтаксис JavaScript: | object.style.borderColor="#FF0000 blue" |
Синтаксис
border-color: цвет|transparent|inherit;
Значения свойства
Значение | Описание |
---|---|
цвет | Цвет рамки, который можно установить различными способами, например: указать название цвета, использовать шестнадцатеричные значения (HEX) или с помощью синтаксиса RGB. |
transparent | Указывает, что цвет рамки должен быть прозрачным. |
inherit | Указывает, что значение наследуется от родительского элемента. |
Пример
CSS Свойство:
border-color:
Результат:
CSS Код:
div {
border-style: solid;
border-width: 5px;
border-color: red;
}
border-style: solid;
border-width: 5px;
border-color: red;
}