[分享]css 滚动到最后

CSS中的滚动条功能可以让网页的内容滚动，从而显示更多的信息。不过，有时我们想让滚动条默认滚动到最底部，这时该怎么做呢？我们可以使用CSS中的scrollbehavior:smooth;属性控制滚动行...

CSS中的滚动条功能可以让网页的内容滚动，从而显示更多的信息。不过，有时我们想让滚动条默认滚动到最底部，这时该怎么做呢？

我们可以使用CSS中的scroll-behavior:smooth;属性控制滚动行为，配合JavaScript中的scrollHeight属性获取元素的滚动高度，从而实现滚动到最底部的效果。

/* CSS代码 */
div {
height: 200px;
overflow-y: scroll;
scroll-behavior: smooth;
}
// JavaScript代码
var div = document.querySelector("div");
div.scrollTop = div.scrollHeight;

上面的代码中，我们给一个高度为200px的div设置了滚动条，并且使用了scroll-behavior:smooth;属性让滚动更加平滑。然后，通过JavaScript获取了这个div元素的滚动高度，将其设置为scrollTop属性的值，即可让滚动条直接滚动到最底部。

需要注意的是，以上代码中的div元素是静态设定高度的，如果你的div高度是动态变化的，需要在数据更新完毕后再进行滚动，否则可能出现没有滚动到最底部的情况。

江苏,常州