CSS scroll-behavior属性

定义和用法

scroll-behavior属性指定当用户单击可滚动框内的链接时是否平滑地为滚动位置设置动画，而不是直接跳转。

特征	说明
默认值	auto
继承	没有
动画	没有。CSS动画参考
CSS版本	CSSOM View Module (Working Draft)
JavaScript语法	object.style.scrollBehavior="smooth"尝试一下

表中的数字指定了完全支持该属性的第一个浏览器版本。数字后跟-ms-， -webkit-，-moz-或-o-指定使用前缀的第一个版本。

属性	IE/Edge	Chrome	FireFox	Safari	Opera
属性名称
scroll-behavior	不支持	61.0+	36.0+	不支持	48.0+

scroll-behavior: auto|smooth|initial|inherit;

为文档添加平滑滚动效果：

html {
  scroll-behavior: smooth;
}

属性值	描述
auto	允许在滚动框内的元素之间直接跳转“滚动效果”。这是默认的
smooth	允许在滚动框中的元素之间进行平滑的动画“滚动效果”。
initial	将此属性设置为其默认值。查看initial关键字
inherit	从其父元素继承此属性。查看inherit关键字