css通过a标签锚点+scroll-behavior滚动行为,丝滑实现“返回顶部”

记得有人制作“返回顶部”这个功能时,总是喜欢用js做,我之前问过他为什么不用a标签做,他说:“a标签做的过于僵硬,没有js实现的效果丝滑顺畅”…,css真的不能制作丝滑的滚动效果吗?
css通过a标签锚点+scroll-behavior滚动行为,丝滑实现“返回顶部”

当然不!CSS可以实现,只是你的认知不足,你可能都没有见过scroll-behavior这个标签。

scroll-behavior为一个滚动框指定滚动行为。 默认auto,立即滚动;smooth ,平稳丝滑的滚动;
css通过a标签锚点+scroll-behavior滚动行为,丝滑实现“返回顶部”

html{scroll-behavior:smooth}
在不考虑ie兼容的情况下,完全可以用a标签锚点跳转+scroll-behavior:smooth实现这个效果!
css通过a标签锚点+scroll-behavior滚动行为,丝滑实现“返回顶部”
51qux博客原文:https://course.51qux.com/1293.html