Source

Position

Verwenden Sie diese Kurzbefehle, um die Position eines Elements schnell zu konfigurieren.

Gemeinsame Werte

Kurse zur schnellen Positionierung sind verfügbar, reagieren jedoch nicht.

<div class="position-static">...</div>
<div class="position-relative">...</div>
<div class="position-absolute">...</div>
<div class="position-fixed">...</div>
<div class="position-sticky">...</div>

Festes Oberteil

Positionieren Sie ein Element von Kante zu Kante oben im Ansichtsfenster. Stellen Sie sicher, dass Sie die Auswirkungen einer festen Position in Ihrem Projekt verstehen; Möglicherweise müssen Sie zusätzliches CSS hinzufügen.

<div class="fixed-top">...</div>

Fester Boden

Positionieren Sie ein Element von Kante zu Kante am unteren Rand des Ansichtsfensters. Stellen Sie sicher, dass Sie die Auswirkungen einer festen Position in Ihrem Projekt verstehen; Möglicherweise müssen Sie zusätzliches CSS hinzufügen.

<div class="fixed-bottom">...</div>

Klebriges Oberteil

Positionieren Sie ein Element am oberen Rand des Ansichtsfensters von Kante zu Kante, aber erst, nachdem Sie daran vorbei gescrollt haben. Das .sticky-topDienstprogramm verwendet CSS position: sticky, das nicht in allen Browsern vollständig unterstützt wird.

IE11 und IE10 werden position: stickyals position: relative. Daher verpacken wir die Stile in einer @supportsAbfrage und beschränken die Klebrigkeit auf nur Browser, die sie richtig rendern können.

<div class="sticky-top">...</div>