Übersicht
Die Eigemschaft border-style ist eine Kurzform zur Angabe der Werte für border-top-style, border-right-style, border-bottom-style und border-left-style.
- Standardwert
- none
- Anwendbar auf
- Alle Elemente
- Geerbt
- Nein
- Medium
- visual
- Werte
- hidden, dashed, dotted, double, groove, inset, outset, ridge, solid, none, inherit
Syntax
border-style: [ hidden | dashed | dotted | double | groove | inset | outset | ridge | solid | none ]{1,4} | inherit
Werte
- hidden
- Der Rahmen wird versteckt
- dashed
- Der Rahmen wird gestrichelt
- dotted
- Der Rahmen wird gepunktet
- double
- Ein doppelter, durchgezogener Rahmen
- groove
- Der Rahmen wirkt wie ein Graben
- inset
- Lässt das Element aussehen, als würde es tiefer liegen
- outset
- Lässt das Element aussehen, als würde es höher liegen (3D-Effekt)
- ridge
- Der Rahmen wirkt wie ein Hügel
- solid
- Durchgezogener Rahmen
- none
- Kein Rahmen, die Breite des Rahmens wird auf 0 gesetzt
- inherit
- der Browser verwendet den Wert des Elternelements.
- 1 Wert
- gilt für border-top-style, border-right-style, border-bottom-style und border-left-style
- 2 Werte
- der erste Wert gilt für border-top-style und border-bottom-style, der zweite für border-right-style und border-left-style
- 3 Werte
- der erste Wert gilt für border-top-style, der zweite für border-right-style und border-left-style und der dritte für border-bottom-style
- 4 Werte
- der erste Wert gilt für border-top-style, der zweite für border-right-style, der dritte für border-bottom-style und der vierte für border-left-style
Beispiele
|
| border-style:solid
|
|
| border-style:dashed
|
|
| border-style:dotted
|
|
| border-style:double
|
|
| border-style:groove
|
|
| border-style:inset
|
|
| border-style:outset
|
|
| border-style:ridge
|
Browser-Kompatibilität
| Version |
| wird unterstützt | Ja | Ja | Ja | Ja |
Ja | Ja | Ja | Ja |
Ja * | Ja | Ja | Ja | Ja | Ja |
Ja | Ja | Ja |
Ja |