С помощью свойства border-color Вы можете установить цвет для всех границ элемента за одно определение.
Свойство border-color может иметь от одного до четырех значений:
Пример с четырьмя заданными значениями:
Пример
/* Верхней границе элемента будет присвоено значение green, правой yellow, нижней blue,
левой black */
p
{
border-style:solid;
border-color:green yellow blue black;
}
Пример с тремя заданными значениями:
Пример
/* Верхней границе элемента будет присвоено green, левой и правой yellow, нижней blue */
p
{
border-style:solid;
border-color:green yellow blue;
}
Пример с двумя заданными значениями:
Пример
/* Верхней и нижней границе элемента будет присвоено green, левой и правой yellow */
p
{
border-style:solid;
border-color:green yellow;
}
Пример с одним заданным значениям:
Пример
/* Всем границам элемента будет присвоено значение green */
p
{
border-style:solid;
border-color:green;
}
Обратите внимание: перед определением цвета границы убедитесь, что она видима установив свойству border-style значение отличное от none.
| Значения | Описание |
|---|---|
| имя цвета | Устанавливает цвет границы с помощью имени цвета (например green определяет зеленый цвет). |
| значение RGB | Устанавливает цвет границы с помощью RGB значения (например rgb(0,255,0) определяет зеленый цвет). |
| шестнадцатеричное значение | Устанавливает цвет границы с помощью шестнадцатеричного значения (например #00ff00 определяет зеленый цвет). |
| transparent | Устанавливает цвет границы прозрачным. Является значением по умолчанию. |