CSS border-inline-color egenskab

Forrige side border-inline
Næste side border-inline-end

Definition og brug

border-inline-color egenskaben indstiller elementets kantfarve i række retning.

Bemærk:for at gøre border-inline-color egenskaben virker, skal der indstilles border-inline-style.

border-inline-color egenskabens værdi kan indstilles på forskellige måder:

hvis border-inline-color egenskaben har to værdier:

border-inline-color: lyserød blå;

Den indre kantfarve ved begyndelsen af rækken er lyserød
Den indre kantfarve ved slutningen af rækken er blå

hvis border-inline-color egenskaben har en værdi:

border-inline-color: blue;

Den indre kantfarven ved begyndelsen og slutningen af rækken er blå

CSS'et border-inline-color egenskab med border-bottom-color,border-left-color,border-right-color og border-top-color Egenskaberne er meget lignende, men border-inline-color Egenskaben afhænger af inline-richtung.

Bemærk:relaterede CSS-egenskaber writing-mode,text-orientation og direction Definerer inline-richtung. Dette påvirker begyndelses- og afslutningspositionen i en række, samt border-inline-color Effekten af egenskaben. For engelske sider, er inline-richtung fra venstre til højre, blokrichtung er nedad.

Eksempel

Eksempel 1

Indstil farve på kanten i inline-richtung:

#example1 {
  border-inline-style: solid;
  border-inline-color: pink;
}
#example2 {
  border-inline-style: solid;
  border-inline-color: pink lightblue;
}

Prøv det selv

Eksempel 2: Kombineret med writing-mode-egenskaben

Kanten på begyndelses- og afslutningspositionen i inline-retningen påvirkes af writing-mode Påvirkningen af egenskaben:

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

Prøv det selv

Eksempel 3: Kombineret med direction-egenskaben

Kanten på begyndelses- og afslutningspositionen i inline-retningen påvirkes af direction Påvirkningen af egenskaben:

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

Prøv det selv

CSS syntaks

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

Egenskabsværdi

Værdi	Beskrivelse
color	Angiv farven på kanten. Standardfarven er elementets nuværende farve. Se CSS-farveværdier for at få en fuldstændig liste over mulige farver.
transparent	Angiv farven på kanten skal være gennemsigtig.
initial	Sæt denne egenskab til dens standardværdi. Se: initial.
inherit	Arv denne egenskab fra sin forældreelement. Se: inherit.

Tekniske detaljer

Standardværdi:	Den nuværende farve på elementet
Arv:	Nej
Animation production:	Understøttes. Se:Animationsrelaterede egenskaber.
Version:	CSS3
JavaScript syntaks:	object.style.borderInlineColor="pink"