Propriedade scroll-behavior

A propriedade scroll-behavior define uma rolagem suave ou instantânea dentro do elemento. A propriedade aceita dois valores auto (transição instantânea para o elemento) e smooth (transição suave).

Sintaxe

cssseletor {
  scroll-behavior: auto ou smooth;
}

Exemplo . Valor auto

Vamos definir a rolagem instantânea:

html<div>texto</div>

cssdiv {
  scroll-behavior: auto;
  width: 4000px;
  height: 2000px;
  background-color: #C2DDFD;
}

Результат:

Exemplo . Valor smooth

E agora vamos definir a rolagem suave:

html<div>texto</div>

cssdiv {
  scroll-behavior: smooth;
  width: 4000px;
  height: 2000px;
  background-color: #C2DDFD;
}

Результат:

Veja também