Это свойство определяет цвет всех четырех сторон рамки HTML элемента. Свойство border-color может принимать от одного до четырех значений.
Например:
- border-color: red green blue pink;
- верхняя сторона рамки красная (red)
- правая сторона рамки зеленая (green)
- нижняя сторона рамки синяя (blue)
- левая сторона рамки розовая (pink)
- border-color: red green blue;
- верхняя сторона рамки красная (red)
- правая и левая стороны рамки зеленые (green)
- нижняя сторона рамки синяя (blue)
- border-color: red green;
- верхняя и нижняя стороны рамки красные (red)
- правая и левая стороны рамки зеленые (green)
- border-color: red;
- все четыре стороны рамки красные (red)
Внимание: Следует всегда определять свойство border-style перед свойством border-color. Элемент должен иметь рамку, прежде чем менять ее цвет.
CSS синтаксис
border-color: цвет | transparent | initial | inherit;
Возможные значения
Значение | Описание |
---|---|
цвет | Устанавливает цвет рамки (см. Как использовать цвета). |
transparent | Значение по умолчанию. Устанавливает, что цвет рамки должен быть прозрачным. |
inherit | Значение наследуется от родительского элемента. |
initial | Устанавливает значение по умолчанию. |
Пример использования
Устанавливаем цвет для четырех сторон рамки параграфа
p {
border-style: solid;
border-color: #ff0000 #0000ff;
}