Propriété scroll-behavior

La propriété scroll-behavior définit un défilement fluide ou instantané à l'intérieur d'un élément. La propriété accepte deux valeurs auto (transition instantanée vers l'élément) et smooth (transition fluide).

Syntaxe

csssélecteur {
  scroll-behavior: auto ou smooth;
}

Exemple . Valeur auto

Définissons un défilement instantané :

html<div>text</div>
cssdiv {
  scroll-behavior: auto;
  width: 4000px;
  height: 2000px;
  background-color: #C2DDFD;
}

Результат:

Exemple . Valeur smooth

Maintenant, définissons un défilement fluide :

html<div>text</div>
cssdiv {
  scroll-behavior: smooth;
  width: 4000px;
  height: 2000px;
  background-color: #C2DDFD;
}

Результат:

Voir aussi

  • la pseudo-classe :fullscreen,
    qui définit le style des éléments en mode plein écran
  • la pseudo-classe :default,
    qui définit le style des éléments par défaut