CSS właściwość border-inline-end-color

Poprzednia strona border-inline-end
Następna strona border-inline-end-style

Definicja i użycie

border-inline-end-color Ustawienie atrybutu koloru krawędzi elementu na końcu jego kierunku wiersza.

Uwaga:Aby border-inline-end-color Atrybut musi być ustawiony, aby być aktywnym border-inline-end-style Atrybut.

CSS border-inline-end-color Atrybuty są związane z border-bottom-color,border-left-color,border-right-color i border-top-color Atrybuty są bardzo podobne, ale border-inline-end-color Atrybut zależy od kierunku wewnętrznego.

Uwaga:powiązane atrybuty CSS writing-mode,text-orientation i direction Definiuje kierunek wewnętrzny. To wpływa na początek i koniec wiersza oraz border-inline-end-color Efekt atrybutu. Dla stron w języku angielskim, kierunek wewnętrzny to z lewej na prawo, a kierunek blokowy to w dół.

Przykład

Przykład 1

Ustaw kolor krawędzi końcowej wewnętrznej:

div {
  border-inline-end-style: solid;
  border-inline-end-color: pink;
}

Spróbuj sam

Przykład 2: Połączenie atrybutu writing-mode

Pozycja krawędzi końcowej wewnętrznej w kierunku wewnętrznym zależy od writing-mode Wpływ atrybutu:

div {
  border-inline-end-style: solid;
  writing-mode: vertical-rl;
  border-inline-end-color: blue;
}

Spróbuj sam

Przykład 3: Połączenie atrybutu direction

Pozycja krawędzi końcowej wewnętrznej w kierunku wewnętrznym zależy od direction Wpływ atrybutu:

div {
  direction: rtl;
  border-inline-end-color: hotpink;
}

Spróbuj sam

Gramatyka CSS

border-inline-end-color: color|transparent|initial|inherit;

Wartość atrybutu

Wartość	Opis
color	Określ kolor krawędzi. Domyślnie jest to bieżący kolor elementu. Zobacz:Wartości kolorów CSS.
transparent	Określ kolor krawędzi jako przejrzysty.
initial	Ustaw tę właściwość na jej wartość domyślną. Zobacz: initial.
inherit	Dziedziczy tę właściwość od elementu nadrzędnego. Zobacz: inherit.

Szczegóły techniczne

Domyślna wartość:	Bieżąca kolor elementu
Inheredność:	Nie
Tworzenie animacji:	Obsługiwane. Zobacz:Atrybuty animacji.
Wersja:	CSS3
Gramatyka JavaScript:	object.style.borderInlineEndColor="pink"