互动性
scroll-behavior
用于控制元素滚动行为的工具。
| 类 | 样式 |
|---|---|
scroll-auto | scroll-behavior: auto; |
scroll-smooth | scroll-behavior: smooth; |
示例(Examples)
¥Examples
使用平滑滚动(Using smooth scrolling)
¥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)
¥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>