CSS border-inline-start eigenschap

Vorige pagina border-inline-end-width
Volgende pagina border-inline-start-color

definitie en gebruik

border-inline-start de eigenschap is een afkorting van de volgende eigenschappen:

CSS border-inline-start de eigenschap is vergelijkbaar met de CSS-eigenschap border-bottom,border-left,border-right en}} border-top zeer vergelijkbaar, maar border-inline-start de eigenschap is afhankelijk van de in-line richting.

Let op:gerelateerde CSS-eigenschappen writing-mode,tekst-oriëntatie en}} direction Definieert de inline-richting. Dit beïnvloedt de begin- en eindpositie van een regel, alsmede border-inline-start Het resultaat van de eigenschap. Voor Engelse pagina's is de inline-richting van links naar rechts, de blokrichting van boven naar beneden.

Voorbeeld

Voorbeeld 1

Stel de breedte, kleur en stijl van de rand aan de beginpositie van de inline-richting in：

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

Probeer het zelf uit

Voorbeeld 2: Combinatie met de writing-mode-eigenschap

De positie van de rand aan de beginpositie van de inline-richting wordt beïnvloed door writing-mode Afwijkende eigenschappen：

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

Probeer het zelf uit

Voorbeeld 3: Combinatie met de direction-eigenschap

De positie van de rand aan de beginpositie van de inline-richting wordt beïnvloed door direction Afwijkende eigenschappen：

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

Probeer het zelf uit

CSS syntaxis

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

Eigenschapswaarde

Waarde	Beschrijving
border-inline-start-width	Specificeer de breedte van de rand aan de beginpositie van de inline-richting van het element. De standaardwaarde is medium.
border-inline-start-style	Specificeer het stijltype van de rand aan de beginpositie van de inline-richting van het element. De standaardwaarde is none.
border-inline-start-color	Specificeer de kleur van de rand aan de beginpositie van de inline-richting van het element. De standaardwaarde is de huidige kleur van de rand.
initial	Stel deze eigenschap in op de standaardwaarde. Raadpleeg initial。
inherit	Deze eigenschap erft van de ouder-element. Raadpleeg inherit。

Technische details

Standaardwaarde：	medium none currentcolor
Inheritance：	Nee
Animatie maken：	Ondersteuning. Raadpleeg：Animatiegerelateerde eigenschappen。
Versie：	CSS3
JavaScript syntaxis：	object.style.borderInlineStart="pink dotted 5px"