CSS border-block-style egenskab
- Forrige side border-block-start-width
- Næste side border-block-width
Definition og brug
relaterte CSS-egenskaper
Egenskaben indstiller kantstilen for elementet i blokretningen.
relaterte CSS-egenskaper
Værdien af egenskaben kan indstilles på forskellige måder:
hvis relaterte CSS-egenskaper
egenskaben har to værdier:
border-block-style: solid;
- Kanten af blokken starter er en gestrikket linje
- Kanten af blokken slutter er en prikket linje
hvis relaterte CSS-egenskaper
egenskaben har en værdi:
border-block-style: gestrikket;
- Kanten af blokken starter og slutter er en gestrikket linje
CSS relaterte CSS-egenskaper
egenskab med CSS-egenskaber border-bottom-style
、border-left-style
、border-right-style
og border-top-style
非常相似,但 relaterte CSS-egenskaper
属性依赖于块方向。
Meget lik, menEgenskapen avhenger av blokkretningen. Eksempel 2: Kombinert med writing-mode-egenskapen
Bemerk: relaterte CSS-egenskaper
Definerer blokkretningen. Dette påvirker blokkens start- og sluttsted, samt
border-block-style
Egenskapsresultatet. For engelske sider, inline-veiledningen er fra venstre til høyre, blokkretningen er nedover.
Eksempel
Eksempel 1 Sett kantstilen for blokkretningen: writing-mode: vertical-rl; #example1 { border-block-style: solid; writing-mode: vertical-rl;
#example2 {
border-block-style: dashed dotted; Eksempel 2: Kombinert med writing-mode-egenskapen
Plasseringen av kantstilen ved begynnelsen og slutten av blokkretningen bestemmes av
writing-mode Egenskapsinnvirkning: div { writing-mode: vertical-rl;
}
Prøv det selv
CSS-syntaks
border-block-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit; | Egenskapsverdi |
---|---|
ingen | Verdi |
Beskrivelse | Standardverdi. Angi ingen kant. |
hidden | Lik none, men unntatt i konflikthåndtering for tabellkant. |
dashed | Angi stiplede kant. |
solid | Angi helt kant. |
double | Angi dobbelt kant. |
groove |
Angi 3D grav kant. Effekten avhenger av verdien av border-color. |
ridge |
Angi 3D hevet kant. Effekten avhenger av verdien av border-color. |
inset |
Angi 3D innfelt kant. Effekten avhenger av verdien av border-color. |
outset |
Angi 3D utbuktende kant. Effekten avhenger av verdien av border-color. |
initial | Sett denne egenskapen til sin standardverdi. Se: initial. |
inherit | Arver denne egenskapen fra sin overordnede element. Se: inherit. |
Teknisk detalj
Standardverdi: | ingen |
---|---|
Arv: | Nei |
Animasjonsproduksjon: | Ikke støttet. Se:Animasjonsrelaterte egenskaper. |
Versjon: | CSS3 |
JavaScript-syntaks: | object.style.borderBlockStyle="dotted" |
Nettleserstøtte
Tallene i tabellen viser den første nettleserversjonen som fullt ut støtter egenskapen.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
87.0 | 87.0 | 66.0 | 14.1 | 73.0 |
Relaterede sider
Instruktioner:CSS kanter
Reference:CSS border egenskab
Reference:CSS border-block egenskab
Reference:CSS border-block-end-style egenskab
Reference:CSS border-block-start-style egenskab
Reference:CSS border-bottom-style egenskab
Reference:CSS border-left-stil egenskab
Reference:CSS border-right-stil egenskab
Reference:CSS border-top-stil egenskab
Reference:CSS writing-mode egenskab
- Forrige side border-block-start-width
- Næste side border-block-width