Kupata: uharifu wa uharifu

Mwongozo wa kufanya kwa CSS uharibifu wa uharifu wa uharifu

平滑滚动

Section 1
点击我，平滑滚动至下方第 2 部分。

点击链接即可看到“平滑”的滚动效果。

注意：移除 scroll-behavior 属性可以取消平滑滚动。

平滑滚动

为 元素添加 scroll-behavior: smooth 可以启用全页面的平滑滚动：

注意：也可以将其添加到特定元素/滚动容器中。

实例

html {
  scroll-behavior: smooth;
}

Jaribu kwa kufikia

浏览器支持

表中的数字注明了完全支持滚动行为属性的首个浏览器版本。

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
61.0 79.0 36.0 14.0 48.0

跨浏览器解决方案

对于不支持 scroll-behavior 属性的浏览器，您可以使用 JavaScript 或 JavaScript 库（如 jQuery）来创建适用于所有浏览器的解决方案：