Wie man erstellt: Sticky-Bilder

Lernen Sie, wie man mit CSS Sticky-Bilder erstellt.

Sticky-Bild

img.sticky {
  position: -webkit-sticky; /* Safari */
  position: sticky;
  top: 0;
}

Probieren Sie es selbst aus

eingestellt position: sticky; Elemente werden basierend auf der Scrollposition des Benutzers positioniert.

Sticky-Elemente wechseln zwischen relativer und fester Positionierung, abhängig von derScrollposition. Bis zur angegebenen Offsetposition im Viewport, wird es relativ positioniert - dann "klebt" es an Ort und Stelle (wie position:fixed)

Hinweis:Hinweis: Internet Explorer, Edge 15 und frühere Versionen unterstützen keine sticky-Position. Safari benötigt einen -webkit- Präfix (siehe Beispiel). Um die sticky-Position zu aktivieren, muss mindestens eine oben,rechts,unten oder links 中的一个。

相关页面

教程：CSS 图像

教程：CSS 定位