border-top-style

Übersicht

Die border-top-style Eigenschaft legt die Rahmenart des oberen Rahmens fest.

• Standardwert: none
• Anwendbar auf: Alle Elemente
• Vererbbar: Nein
• Prozentwerte: Nein
• Medium: visuell
• berechneter Wert: wie festgelegt

Syntax

border-top-style: none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset | inherit 

Werte

none

Standardwert. Es wird kein oberer Rahmen gezeichnet und die Breite wird auf '0' zurückgesetzt.

hidden

Genau wie bei none wird kein Rahmen angezeigt. Das Verhalten unterscheidet sich jedoch beim "Collapsing Border Model" innerhalb von Tabellen.
Wenn border-collapse: collapse gesetzt wurde, wird auch an den angrenzenden Nachbarzellen kein Rahmen dargestellt.

dotted

Punktierte Linie.

dashed

Gestrichelte Linie.

solid

Durchgehende Linie.

double

Zwei durchgehende Linien mit Zwischenraum. Die zwei Linien und der Zwischenraum sind jeweils ein Drittel der border-top-width Angabe groß.

groove

Der Rahmen wirkt eingekerbt (3D-Effekt).

ridge

Der Rahmen wirkt wie eine Kante (3D-Effekt).

inset

Durch den Rahmen wirkt das ganze Element eingetieft (3D-Effekt).

outset

Durch den Rahmen wirkt das ganze Element herausgehoben (3D-Effekt).

inherit

Der Wert des Elternelements wird geerbt.

Beispiele

.beispielEins {                      
  border-top-style: dashed;      /* gestrichelt */
}

.beispielZwei {
  border-top-style: groove;      /* Einkerbung */
}

.beispielDrei {
 border-top-style: hidden;       /* Collapsing Border Model */ 
 border-collapse: collapse;
}

Browser Kompatibilität

Spezifikation

• CSS 3 Background and Borders #border-top-style
• CSS 2.1 Box #border-top-style

Siehe auch

• border-top, border-top-color, border-top-width
• border-style, border-bottom-style, border-left-style, border-right-style