Comment créer : image collée

Apprendre à créer des images collées avec CSS.

image collée

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

Essayez-le vous-même

a été configuré position: sticky; les éléments se positionneront en fonction de la position de défilement de l'utilisateur.

Les éléments collés basculent entre la position relative et la position fixe, en fonction de la position de défilement. Avant d'atteindre la position d'offset donnée dans la fenêtre de visualisation, il est positionné en position relative - puis il 'colle' en place (comme position:fixed)

Attention :Internet Explorer, Edge 15 et versions antérieures ne prennent pas en charge la position collée. Safari nécessite un -webkit- Préfixe (voir l'exemple). Pour que la position collée fonctionne, il faut au moins spécifier haut、droite、bas ou gauche dans l'un des cas.

Pages connexes

Tutoriel :Image CSS

Tutoriel :Positionnement CSS