CSS border-lijn-eind-kleur eigenschap

De vorige pagina border-inline-end
Volgende pagina border-inline-end-style

Definitie en gebruik

border-inline-end-color Eigenschappen te stellen van de randkleur aan het einde van de lijnrichting van het element.

Opmerking:Om border-inline-end-color Om de eigenschappen effectief te maken, moet er worden ingesteld border-inline-end-style Eigenschappen.

CSS border-inline-end-color eigenschappen en border-bottom-color,border-left-color,border-right-color en border-top-color De eigenschappen zijn zeer vergelijkbaar, maar border-inline-end-color De eigenschap is afhankelijk van de inline-richting.

Opmerking:gerelateerde CSS-eigenschappen writing-mode,text-orientation en direction Definieert de inline-richting. Dit beïnvloedt de start- en eindpositie van een regel, evenals border-inline-end-color Het effect van de eigenschap. Voor Engelse pagina's is de inline-richting van links naar rechts, de blokken zijn naar beneden.

Voorbeeld

Voorbeeld 1

Stel de kleur van de rand aan het einde van de inline-richting in:

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

Probeer het zelf

Voorbeeld 2: Gebruik van de writing-mode-eigenschap

De positie van de rand aan het einde van de inline-richting wordt beïnvloed door writing-mode Het effect van de eigenschap:

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

Probeer het zelf

Voorbeeld 3: Gebruik van de direction-eigenschap

De positie van de rand aan het einde van de inline-richting wordt beïnvloed door direction Het effect van de eigenschap:

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

Probeer het zelf

CSS syntax

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

Eigenschapswaarde

Waarde	Beschrijving
color	Specificeer de randkleur. Standaard is de huidige kleur van het element. Raadpleeg:CSS Color Values.
transparent	Specificeer de randkleur als transparant.
initial	Stel deze eigenschap in op de standaardwaarde. Raadpleeg initial.
inherit	Deze eigenschap erfde van het ouder element. Raadpleeg inherit.

Technische details

Standaardwaarde:	De huidige kleur van het element
Inheritance:	Nee
Animatie maken:	Ondersteund. Raadpleeg:Eigenschappen gerelateerd aan animatie.
Versie:	CSS3
JavaScript syntax:	object.style.borderInlineEndColor="pink"