Come creare: immagine adesiva

Impara come creare immagini adesive utilizzando CSS.

Immagine adesiva

Attenzione:Questo esempio non è applicabile a Internet Explorer o Edge 15 e versioni precedenti.

Prova tu stesso

Immagine adesiva

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

Prova tu stesso

è stato impostato position: sticky; Gli elementi saranno posizionati in base alla posizione di scorrimento dell'utente.

Gli elementi adesivi passano tra posizionamento relativo e fisso, a seconda della posizione di scorrimento. Prima di raggiungere la posizione di offset specificata nella viewport, viene posizionato in modo relativo - poi si attacca in posizione (come position:fixed)

Attenzione:Internet Explorer, Edge 15 e versioni precedenti non supportano il posizionamento adesivo. Safari richiede un -webkit- Prefisso (vedi esempio). Per attivare la posizionamento adesivo, è necessario specificare almeno superioredestrainferiore o sinistra 中的一个。

Pagine correlate

Tutorial:Immagine CSS

Tutorial:Posizionamento CSS