scroll-behaviorプロパティ

scroll-behaviorプロパティは、要素内のスクロールを スムーズまたは瞬時に行うように設定します。 プロパティはauto（要素への瞬間的な遷移）と smooth（スムーズな遷移）の2つの値を受け入れます。

構文

cssセレクタ {
  scroll-behavior: auto または smooth;
}

例 . autoの値

瞬時のスクロールを設定してみましょう：

html<div>テキスト</div>

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

Результат:

例 . smoothの値

では、スムーズスクロールを設定しましょう：

html<div>テキスト</div>

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

Результат:

関連項目