Css滚动条高度没减少 |div css做的网页代码

/* CSS代码 */
::-webkit-scrollbar {
width: 5px;
height: 10px;
}
::-webkit-scrollbar-track {
background-color: #f5f5f5;
}
::-webkit-scrollbar-thumb {
background-color: #1c1c1c;
border-radius: 5px;
}

根据上面的代码，偶的滚动条应该是宽度为5px，高度为10px，滑块背景色为黑色，颜色为白色的圆角矩形。结果却发现，滑块的高度并没有减少，依然是默认的值。

在经过不断的查找后，终于找到了问题所在，原来是偶没有给滑块添加高度：

/* 修正后的代码 */
::-webkit-scrollbar {
width: 5px;
height: 10px;
}
::-webkit-scrollbar-track {
background-color: #f5f5f5;
}
::-webkit-scrollbar-thumb {
background-color: #1c1c1c;
border-radius: 5px;
height: 50px; /* 添加高度 */
}

现在，偶的滑块高度已经减少了，滚动条也很好看了。

这个问题的产生，其实是因为偶太注重宽度而忽略了高度，所以，在使用CSS设计滚动条时，大家要全方位的考虑，才能做出完美的滚动条。

谢谢您的阅读，希望对您有所帮助。