1. Interactivity
  2. scroll-behavior

Interactivity

scroll-behavior

Utilities for controlling the scroll behavior of an element.

ClassStyles
scroll-auto
scroll-behavior: auto;
scroll-smooth
scroll-behavior: smooth;

Examples

Using smooth scrolling

Use the scroll-smooth utility to enable smooth scrolling within an element:

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

Setting the scroll-behavior only affects scroll events that are triggered by the browser.

Using normal scrolling

Use the scroll-auto utility to revert to the default browser behavior for scrolling:

<html class="scroll-smooth md:scroll-auto">  <!-- ... --></html>
Copyright © 2025 Tailwind Labs Inc.·Trademark Policy

Tailwind CSS 中文网(本网站)的目标是为中文开发者提供准确、及时的 Tailwind CSS 中文文档

Tailwind CSS 中文文档由本网站维护人员共同翻译,采用 MIT 开源协议发布

本网站与 tailwindcss.com 及 Tailwind Labs Inc. 并无从属关系

Tailwind 商标由 Tailwind Labs Inc. 所有

京ICP备15031610号-8