互动性
scroll-behavior
用于控制元素滚动行为的工具
| 类 | 样式 |
|---|---|
scroll-auto | scroll-behavior: auto; |
scroll-smooth | scroll-behavior: smooth; |
示例(Examples)
使用平滑滚动(Using smooth scrolling)
使用 scroll-smooth 工具在元素内启用平滑滚动：
🌐 Use the scroll-smooth utility to enable smooth scrolling within an element:
<html class="scroll-smooth"> <!-- ... --></html>设置 scroll-behavior 只会影响由浏览器触发的滚动事件。
🌐 Setting the scroll-behavior only affects scroll events that are triggered by the browser.
使用正常滚动(Using normal scrolling)
使用 scroll-auto 工具将滚动行为恢复为默认浏览器设置：
🌐 Use the scroll-auto utility to revert to the default browser behavior for scrolling:
<html class="scroll-smooth md:scroll-auto"> <!-- ... --></html>