Stilpositionseigenschaft

Definition und Verwendung

position Eigenschaftseinstellungen oder Rückgabe des Typs der Positionsverwaltung des Elements (statisch, relativ, absolut oder fest).

Weitere Informationen siehe:

CSS Tutorial:CSS Positionierung

CSS Referenzhandbuch:Positionseigenschaft

Beispiel

Beispiel 1

Position des <div>-Elements von relativer Position auf absolute Position ändern:

document.getElementById("myDIV").style.position = "absolute";

Selbst ausprobieren

Beispiel 2

Verschiedene Positionstypen verwenden:

function myFunction(x)  {
  var whichSelected = x.selectedIndex;
  var posVal = x.options[whichSelected].text;
  var elem = document.getElementById("myDiv");
  elem.style.position = posVal;
}

Selbst ausprobieren

Beispiel 3

Rückgabe der Position des <h2>-Elements:

alert(document.getElementById("myH2").style.position);

Selbst ausprobieren

Syntax

Positionseigenschaft zurückgeben:

object.style.position

Positionseigenschaft setzen:

object.style.position = "static|absolute|fixed|relative|sticky|initial|inherit"

Attributwert

Wert Beschreibung
static Die Elemente werden in der Reihenfolge dargestellt, in der sie im Dokumentstrom auftreten. Standard.
absolute Das Element wird relativ zu ihrem ersten positionierten (nicht statischen) Vorfahren element positioniert.
fixed Das Element wird relativ zum Browserfenster positioniert.
relative

Das Element wird relativ zu seiner normalen Position positioniert.

Daher erhöht "left:20" die linke Position des Elements um 20 Pixel.
sticky

Das Element wird basierend auf der Scrollposition des Benutzers positioniert.

Sticky-Elemente wechseln zwischen relative und fixed basierend auf derScrollposition.

Es ist relativ positioniert, bis es im Ansichtsfenster die angegebene Verschiebeposition erreicht - dann "klebt" es an der richtigen Position (z.B. position:fixed).

Anmerkung:Nicht unterstützt in IE/Edge 15 oder früheren Versionen. Safari unterstützt seit Version 6.1 den Webkit-Präfix.
initial Diese Eigenschaft wird auf ihren Standardwert gesetzt. Siehe initial.
inherit Diese Eigenschaft wird von ihrem übergeordneten Element geerbt. Siehe inherit.

Technische Details

Standardwert: static
Rückgabewert: Ein String, der den Typ der Positionseigenschaft des Elements angibt.
CSS Version: CSS2

Browser-Unterstützung

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Unterstützung Unterstützung Unterstützung Unterstützung Unterstützung