Style bottom-Eigenschaft

Style 对象参考手册Style-Objekt

Definition und Verwendung

Die bottom-Eigenschaft legt die untere Position eines positionierten Elements fest oder gibt sie zurück.

Diese Eigenschaft legt die untere Position des Elements fest, einschließlich: padding, scrollbar, border und margin.

Tipp:Ein positioniertes Element ist ein Element, dessen position-Eigenschaft auf relative, absolute oder fixed gesetzt ist.

Syntax

Legen Sie die bottom-Eigenschaft fest:

Object.style.bottom="auto|length|%|inherit"

Die bottom-Eigenschaft zurückgeben:

Object.style.bottom

Wert Beschreibung
auto Standardmäßig berechnet der Browser die untere Position.
length Legt die Unterkante des Elements auf eine Position relativ zur Unterkante des nächstgelegenen positionierten Elternelements fest, wobei Einheiten wie px, cm usw. verwendet werden. Negative Werte können verwendet werden.
% Legt die Unterkante des Elements auf eine prozentuale Position relativ zur Unterkante des nächstgelegenen positionierten Elternelements fest.
inherit Der Wert der bottom-Eigenschaft wird vom Elternelement geerbt.

Browser-Unterstützung

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Alle wichtigen Browser unterstützen die bottom-Eigenschaft.

Hinweis:IE7 und frühere Versionen unterstützen den Wert "inherit" nicht. IE8 unterstützt "inherit" nur, wenn ein !DOCTYPE angegeben ist. IE9 unterstützt "inherit".

Beispiele

Beispiele

Legen Sie die untere Position einer Schaltfläche fest:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Beispiel-Tutorial (example.com)</title>
<style type="text/css">
#b1{
    position:absolute;
}
</style>
<script>
function displayResult(){
    document.getElementById("b1").style.bottom="100px";
}
</script>
</head>
<body>

<input type="button" id="b1" onclick="displayResult()" value="Set the bottom position">

</body>
</html>

Selbst ausprobieren »

Style 对象参考手册Style-Objekt Andere Erweiterungen