border-bottom

Übersicht

Die border-bottom Eigenschaft legt den unteren Rahmen eines Elementes fest und ist eine Kurzform für
border-bottom-color, border-bottom-style und border-bottom-width. Die Werte der drei Eigenschaften können in beliebiger Reihenfolge angegeben werden.

  • Standardwert the concatenation of the initial values of its longhand properties:
    • border-bottom-width: medium
    • border-bottom-style: none
    • border-bottom-color: currentColor
  • Anwendbar auf Alle Elemente
  • Vererbt Nein
  • Prozentwerte
  • Medium visuell
  • Berechneter Wert wie die einzelnen Werte der Kurzschreibweise:
    • border-bottom-width: the absolute length oder 0 if border-bottom-style ist none oder hidden
    • border-bottom-style: siehe Spezifikation
    • border-bottom-color: If the value ist translucent, the computed value will be the rgba() corresponding one. If it isn't, it will be the rgb() corresponding one. The transparent keyword maps to rgb(0,0,0).
  • Animierbar wie die jeweiligen Kurzschreibweisen:
    • border-bottom-color: Ja, als Farbe
    • border-bottom-style: Nein
    • border-bottom-width: Ja, als Längenangabe
  • Canonical order order of appearance in the formal grammar of the values

Syntax

border-bottom: [ <Rahmenbreite> || <Rahmenstil> || <Rahmenfarbe> ] | inherit

Werte

<Rahmenbreite>
Optional. Wenn nichts festgelegt ist, wird medium verwendet. Siehe: border-bottom-width.
<Rahmenstil>
Erforderlich. Wenn nichts festgelegt ist, wird none verwendet. Siehe: border-bottom-style.
<Rahmenfarbe>
Optional. Wenn nichts festgelegt ist, wird der Wert der color Eigenschaft des Elements genommen. Siehe: border-bottom-color.
inherit
Der Wert des Elternelements wird geerbt.

Beispiele

.beispielEins {
  border-bottom: 1px solid #000;
}

.beispielZwei {  
  border-bottom-style: dotted;
  border-bottom: thick green;
  
  /* Bedeutet das gleiche wie: */
  
  border-bottom-style: dotted;
  border-bottom: none thick green;
  
  /* border-bottom-style wird nach Angabe von border-bottom ignoriert. 
  Es wird kein unterer Rahmen gezeichnet. */
}

Spezifikation

Specification Status Comment
CSS Backgrounds and Borders Module Level 3 Candidate Recommendation No direct changes, though the modification of values for the border-bottom-color do apply to it.
CSS Level 2 (Revision 1) Recommendation No significant changes
CSS Level 1 Recommendation  

Browser Kompatibilität

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 1.0 1.0 (1.7 or earlier) 4 3.5 1.0 (85)
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support 1.0 1.0 (1.0) (Yes) (Yes) (Yes)

Siehe auch

Border-bottom-related properties: border-bottom, border-bottom-color, border-bottom-style, border-bottom-width
Border-related properties: border, border-width, border-style, border-color, margin, padding

 

Schlagwörter des Dokuments und Mitwirkende

Schlagwörter: 
Mitwirkende an dieser Seite: SJW, fscholz, Yuichiro, Michael2402
Zuletzt aktualisiert von: SJW,
Seitenleiste ausblenden