scroll-behavior

要素のスクロール動作を制御するためのユーティリティ。

クラススタイル

クラス	スタイル
`scroll-auto`	`scroll-behavior: auto;`
`scroll-smooth`	`scroll-behavior: smooth;`

scroll-auto

scroll-behavior: auto;

scroll-smooth

scroll-behavior: smooth;

例

要素内でスムーズスクロールを有効にするには、scroll-smoothユーティリティを使用します。

<html class="scroll-smooth">
  <!-- ... -->
</html>

scroll-behaviorを設定しても、ブラウザによってトリガーされるスクロールイベントにのみ影響します。

scroll-autoユーティリティを使用して、スクロールのデフォルトのブラウザの動作に戻します。

<html class="scroll-smooth md:scroll-auto">
  <!-- ... -->
</html>