CSS/Eigenschaften/border-bottom

Die Eigenschaft border-bottom bestimmt den unteren Rahmen eines Elements.

Erlaubte Werte

• 1 - 3 Angaben zu Rahmendicke, -stil und -farbe
• inherit

Vererbung steuernde Werte inherit, initial, unset und revert

Standardwert

siehe Einzeleigenschaften

anwendbar auf

alle Elemente

Vererbung

nein

animierbar

ja

Beispiel

Randlinien an einzelnen Seiten ansehen …

      h2 {
        border-bottom: thick double blue;
        float: left;
        width: 48%;
      }
      h2.anders {
        border-bottom: medium solid blue;
        float: right;
      }
      p {
        border: 1px solid red;
        width: 30em;
        padding: 5px;
        clear: both;
      }
      p.beachten {
        border: none;
        border-left: 5px solid #FFCCCC;
      }

• Überschriften nehmen als Block-Elemente normalerweise die gesamte Fensterbreite ein. Die Angaben zu float bei den Überschriften stellen sicher, dass diese nur so breit sind, wie ihr Inhalt es erfordert. Näheres dazu finden Sie unter CSS/Eigenschaften/float.
• Für den Absatz mit der Klasse „beachten“ gilt wie für alle Absätze zunächst einmal ein kompletter roter Rahmen. Da dieser nicht erwünscht ist, wird er mit border: none; entfernt, bevor der linke Rahmen gesetzt wird.

Beachten Sie:

• border-bottom ist die Kurzschreibform für die Werte border-bottom-width, border-bottom-style und border-bottom-color
• Da die Voreinstellung von border-bottom-style none ist, sollte im Allgemeinen mindestens eine Angabe zu border-bottom-style erfolgen.

Empfehlung: Um den Elementen thead, tbody, tfoot oder tr einen sichtbaren Rahmen zuzuweisen, müssen die Rahmen innerhalb der Tabelle zusammenfallen (d. h. table { border-collapse: collapse; })

Siehe auch

• CSS/Tutorials/Boxmodell/Rahmen

Weblinks

• Spezifikation (W3C): Border Shorthand Properties
• MDN: border-bottom