要添加自定义的滚动条样式，可以使用CSS的::-webkit-scrollbar伪元素来实现。
下面是一个示例，展示如何添加自定义的滚动条样式：
/* 添加滚动条样式 */
::-webkit-scrollbar {
width: 8px; /* 设置滚动条的宽度 */
}
/* 添加滚动条轨道样式 */
::-webkit-scrollbar-track {
background-color: #f1f1f1; /* 设置滚动条轨道的背景颜色 */
}
/* 添加滚动条滑块样式 */
::-webkit-scrollbar-thumb {
background-color: #888; /* 设置滚动条滑块的背景颜色 */
border-radius: 4px; /* 设置滚动条滑块的圆角 */
}
/* 鼠标悬停在滚动条上时的样式 */
::-webkit-scrollbar-thumb:hover {
background-color: #555; /* 设置滚动条滑块的背景颜色 */
}
将上述样式添加到你的CSS文件中，或者直接在HTML文件中的<style>标签中添加，即可自定义滚动条的样式。
注意：上述样式只适用于WebKit内核的浏览器，比如Chrome、Safari等。对于其他浏览器，可以使用类似的样式，但可能会有一些差异。
