CSS inre-border-start egenskap

Föregående sida border-inline-end-width
Nästa sida border-inline-start-color

Definition och användning

border-inline-start Attribut är en förkortning av följande attribut:

CSS border-inline-start attribut är likvärdigt med CSS-attribut border-bottom、border-left、border-right och}} border-top mycket lika, men border-inline-start attribut är beroende av inline-direction.

Observera:relaterade CSS-attribut writing-mode、text-orientation och}} direction Definierar inline-riktningen. Detta påverkar början och slutet av en rad, samt border-inline-start Resultatet av egenskapen. För engelska sidor är inline-riktningen från vänster till höger, och blockriktningen från topp till botten.

Exempel

Exempel 1

Ställ in bredd, färg och stil för kant vid start av inline-riktningen:

div {
  border-inline-start: 10px solid pink;
}

Prova själv

Exempel 2: Kombinera med writing-mode-egenskapen

Positionen av kant vid start av inline-riktningen påverkas av writing-mode Påverkan av egenskap:

div {
  writing-mode: vertical-rl;
  border-inline-start: 5px solid blue;
}

Prova själv

Exempel 3: Kombinera med direction-egenskapen

Positionen av kant vid start av inline-riktningen påverkas av direction Påverkan av egenskap:

div {
  direction: rtl;
  border-inline-start: 5px solid hotpink;
}

Prova själv

CSS-syntaks

border-inline-start: border-inline-start-width border-inline-start-style border-inline-start-color|initial|inherit;

Egenskapsvärde

Värde	Beskrivning
border-inline-start-width	Specificerar kantens bredd vid start av inline-riktningen. Standardvärdet är medium.
border-inline-start-style	Specificerar kantstilen vid start av inline-riktningen. Standardvärdet är none.
border-inline-start-color	Specificerar kantfärgen vid start av inline-riktningen. Standardvärdet är den aktuella kantfärgen.
initial	Sätt denna egenskap till dess standardvärde. Se vidare initial.
inherit	Får denna egenskap från föräldrelementet. Se vidare inherit.

Tekniska detaljer

Standardvärde:	medium none currentcolor
Arvande:	Nej
Animeringsproduktion:	Stöd. Se vidare:Animationrelaterade egenskaper.
Version:	CSS3
JavaScript-syntaks:	object.style.borderInlineStart="pink dotted 5px"