Свойство border-color
Задает цвет границы элемента со всех сторон
border-color: #ccc;Пошаговый план! Как быстро научиться создавать сайты!
Chrome
Все
Edge
Все
FireFox
Все
IE
6+
iOS Safari
Все
Opera
Все
Safari
Все
Значения
border-color: #ffffff;
Шестнадцатеричное значение цвета
<style>
.example-1 {
width: 150px;
height: 150px;
background-color: #eee;
border: 5px solid;
border-color: #5091f3;
}
</style>
<div class="example-1"></div>border-color: red;
Ключевое имя цвета
<style>
.example-2 {
width: 150px;
height: 150px;
background-color: #eee;
border: 5px solid;
border-color: red;
}
</style>
<div class="example-2"></div>border-color: transparent;
Прозрачный цвет
<style>
.example-3 {
width: 150px;
height: 150px;
background-color: #eee;
border: 5px solid;
border-color: transparent;
}
</style>
<div class="example-3"></div>border-color: rgb(0, 0, 0);
Цвет границы в RGB формате, где R - красный канал, G - зеленый канал и B - синий канал
<style>
.example-4 {
width: 150px;
height: 150px;
background-color: #eee;
border: 5px solid;
border-color: rgb(0, 0, 0);
}
</style>
<div class="example-4"></div>border-color: rgba(0, 0, 0, 0.5);
Цвет границы в RGBa формате, где R - красный канал, G - зеленый канал и B - синий канал и последнее значение непрозрачность от 0 до 1.
<style>
.example-5 {
width: 150px;
height: 150px;
background-color: #eee;
border: 5px solid;
border-color: rgba(0, 0, 0, 0.5);
}
</style>
<div class="example-5"></div>