Właściwość borderColor stylu

Definicja i użycie

borderColor Właściwość ustawia lub zwraca kolor krawędzi elementu.

Ta właściwość może przyjąć od jednej do czterech wartości:

  • Wartość, na przykład: p {kolor-krawędzi: czerwony} - wszystkie cztery krawędzie są czerwone
  • Dwie wartości, na przykład: p {border-color: red transparent} - górna i dolna krawędź jest czerwona, boczne krawędzie są przezroczyste
  • Trzy wartości, na przykład: p {border-color: red green blue}- górna krawędź jest czerwona, boczne krawędzie są zielone, dolna krawędź jest niebieska
  • Cztery wartości, na przykład: p {border-color: red green blue yellow} - górna krawędź jest czerwona, prawa krawędź jest zielona, dolna krawędź jest niebieska, lewa krawędź jest żółta

Zobacz również:

Tutorial CSS:Krawędzie CSS

Przeglądarka CSS:Atrybut border-color

Przeglądarka HTML DOM:Atrybut border

Przykład

Przykład 1

Zmień kolor czterech krawędzi elementu <div> na czerwony:

document.getElementById("myDiv").style.borderColor = "red";

Spróbuj sam

Przykład 2

Zmień kolor górnej i dolnej krawędzi elementu <div> na zielony, a kolor bocznych krawędzi na fioletowy:

document.getElementById("myDiv").style.borderColor = "green purple";

Spróbuj sam

Przykład 3

Zwracanie koloru krawędzi elementu <div>:

alert(document.getElementById("myDiv").style.borderColor);

Spróbuj sam

Gramatyka

Zwracanie atrybutu borderColor:

obiekt.style.borderColor

Ustawienie atrybutu borderColor:

obiekt.style.borderColor = "color|transparent|initial|inherit"

Wartość atrybutu

Wartość Opis
color

Określa kolor krawędzi. Domyślnym kolorem jest czarny.

Zobacz: Wartości kolorów CSS, aby uzyskać pełną listę możliwych wartości kolorów.
przezroczysty Kolor krawędzi jest przezroczysty (podszyte treści są widoczne).
initial Ustawia tę właściwość na jej wartość domyślną. Zobacz: initial.
inherit Inherbuje tę właściwość od elementu nadrzędnego. Zobacz: inherit.

Szczegóły techniczne

Domyślna wartość: czarny
Zwracana wartość: Ciąg znaków, który reprezentuje kolor krawędzi elementu.
Wersja CSS: CSS1

Wsparcie przeglądarki

Tabela zawiera wersje przeglądarek, które w pełni wspierają tę właściwość.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 3.5