CSS unten-Eigenschaft

Definition und Verwendung

Die Eigenschaft bottom definiert den unteren Rand des Elements. Diese Eigenschaft bestimmt den Abstand zwischen der unteren Außengrenze des positionierten Elements und der unteren Grenze des umschließenden Blocks.

Anmerkung:Wenn der Wert der Eigenschaft "position" "static" ist, hat die Einstellung der Eigenschaft "bottom" keine Wirkung.

Beschreibung

Für statische Elemente ist der Wert auto; für Längenwerte der entsprechende absolute Wert; für prozentuale Werte der angegebene Wert; sonst auto.

Für relativ definierte Elemente sind die Werte von bottom und top 0, wenn beide auto sind; wenn einer von beiden auto ist, wird der entgegengesetzte Wert der anderen Wertes genommen; wenn beide nicht auto sind, wird bottom den entgegengesetzten Wert von top übernehmen.

Siehe auch:

CSS-Tutorial:CSS-Positionierung

HTML DOM Referenzhandbuch:bottom-Eigenschaft

Beispiel

Setzen Sie den unteren Rand des Bildes 5 Pixel über dem unteren Rand des umschließenden Elements:

img
  {
  position:absolute;
  bottom:5px;
  }

Versuchen Sie es selbst

CSS-Syntax

bottom: auto|length|initial|inherit;

Eigenschaftswert

Wert Beschreibung
auto Standardwert. Die Position am Boden wird durch den Browser berechnet.
% Legen Sie die Position des Elements am unteren Rand in Prozent fest. Negative Werte sind zulässig.
length Legen Sie die Position des Elements am unteren Rand mit Einheiten wie px, cm und anderen fest. Negative Werte sind zulässig.
inherit Definiert, dass der Wert der Eigenschaft bottom vom übergeordneten Element geerbt wird.

Technische Details

Standardwert: auto
Vererbbarkeit: nein
Version: CSS2
JavaScript-Syntax: object.style.bottom="50px"

Mehr Beispiele

Unteren Rand des Bildes mit Pixelwerten einstellen
Dieses Beispiel zeigt, wie Sie den unteren Rand des Bildes mit Pixelwerten einstellen können.
Unteren Rand des Bildes mit Prozentwerten einstellen
Dieses Beispiel zeigt, wie Sie den unteren Rand des Bildes mit Prozentwerten einstellen können.

Browser-Unterstützung

Die Zahlen in der Tabelle weisen auf die erste Browser-Version hin, die diese Eigenschaft vollständig unterstützt.

Chrome IE / Edge Firefox Safari Opera
1.0 5.0 1.0 1.0 6.0