CSS border-block-style egenskap

Föregående sida border-block-start-width
Nästa sida border-block-width

Definition och användning

relaterade CSS-egenskaper egenskapen ställer in kantlinjens stil för elementet i blockriktningen.

relaterade CSS-egenskaper Värdet för egenskapen kan ställas in på olika sätt:

om relaterade CSS-egenskaper egenskapen har två värden:

border-block-style: solid;

Stylen för kantlinjen vid början av blocket är stilla streck
Stylen för kantlinjen vid slutet av blocket är punktsprid

om relaterade CSS-egenskaper egenskapen har ett värde:

border-block-style: dashed;

Stylen för kantlinjen vid början och slutet av blocket är stilla streck

CSS relaterade CSS-egenskaper egenskaper och CSS-egenskaper border-bottom-style、border-left-style、border-right-style och border-top-style 非常相似，但 relaterade CSS-egenskaper 属性依赖于块方向。

Mycket liknande, menEgenskapen är beroende av blockriktningen. Exempel 2: Kombinera writing-mode-egenskapen Observera: relaterade CSS-egenskaper Definierar blockriktningen. Detta påverkar början och slutet av blocken, samt

border-block-style

Egenskapsresultatet. För engelska sidor, inline-riktningen är från vänster till höger, och blockriktningen är nedåt.

Exempel

Exempel 1
  Ställ in kantstilar för blockriktningen:
writing-mode: vertical-rl;
#example1 {
  border-block-style: solid;
writing-mode: vertical-rl;

border-block-style: dotted;

#example2 {

border-block-style: dashed dotted; Exempel 2: Kombinera writing-mode-egenskapen Platsen för kantstilar vid början och slutet av blockriktningen påverkas av

writing-mode
  Påverkan av egenskapen:
  div {
writing-mode: vertical-rl;

border-block-style: dotted;

}

Prova själv

CSS-språk

border-block-style: none\|hidden\|dotted\|dashed\|solid\|double\|groove\|ridge\|inset\|outset\|initial\|inherit;	Egenskapsvärde
none	Värde
Beskrivning	Standardvärde. Specificera ingen kant.
hidden	Liknar none, men förutom vid lösning av kantkonflikter för tabelllement.
dashed	Specificera punkterad kant.
solid	Specificera rak kant.
double	Specificera dubbel kant.
groove	Specificera 3D veckad kant. Effekten beror på värdet av border-color.
ridge	Specificera 3D böjd kant. Effekten beror på värdet av border-color.
inset	Specificera 3D inbuktande kant. Effekten beror på värdet av border-color.
outset	Specificera 3D utbuktande kant. Effekten beror på värdet av border-color.
initial	Sätt detta egenskap till dess standardvärde. Se vidare initial.
inherit	Får detta egenskap från sina föräldrelement. Se vidare inherit.

Tekniska detaljer

Standardvärde:	none
Ärvnad:	Nej
Animeringsproduktion:	Stöds inte. Se vidare:Animeringsrelaterade egenskaper.
Version:	CSS3
JavaScript-språk:	object.style.borderBlockStyle="dotted"