CSS-свойство border-color является более коротким свойством для установки отдельных цветовых свойств границы, то есть border-top-color, border-right-color, border-bottom-color и border-left-color в одном.
| Значение по умолчанию: | Индивидуальные CSS-свойства |
| Применяется к: | Все элементы |
| Наследование: | Нет |
| Анимирование: | Да. Анимируемые свойства |
| Версия: | CSS 1, 2, 3 |
Синтаксис
Синтаксически свойства задаются по следующему шаблону:
border-color: [ color | transparent ] 1 to 4 values | inherit
Эта сокращенная запись может принимать одно, два, три или четыре значения, разделенных пробелами.
- Если указано одно значение, оно применяется ко всем сторонам границы.
- Если указано два значения, первое значение используется для верхней и нижней границы, а второе для правой и левой.
- Если указано три значения, первое значение используется для верхней границы, второе значение используется для правой и левой границы, а третье значение для нижней границы.
- Если указано четыре значения, каждое значение применяется к границе отдельно в порядке сверху, справа, снизу и слева.
Примеры написания кода свойства border-color:
p {
border-style: solid;
border-color: #ff0000;
}
Вы должны объявить свойство border-style перед CSS-свойством border-color. Элемент должен иметь границы, прежде чем вы сможете установить цвет границы.
Значения свойств
В следующей таблице описаны значения этого свойства.
| Значение | Описание |
|---|---|
| color | Определяет цвет верхней границы. Список возможных форматов цвета см. в руководстве по CSS Color. |
transparent |
Позволяет границе быть прозрачной, хотя она может занимать пространство, установленное свойством border-width. |
initial |
Устанавливает это свойство в значение по умолчанию. |
inherit |
Если указан, связанный элемент принимает вычисленное значение свойства его родительского элемента border-bottom-color. |
Поддержка браузеров
Свойство border-color поддерживается во всех основных браузерах.
















