我用下面的代码设计了垂直滚动条的样式:
::-webkit-scrollbar {
width: 4px;
border: 1px solid #d5d5d5;
}
::-webkit-scrollbar-track {
border-radius: 0;
background: #eeeeee;
}
::-webkit-scrollbar-thumb {
border-radius: 0;
background: #b0b0b0;
}
现在,我的垂直滚动条看起来像这样:
但是,我的水平滚动条看起来像这样:
我如何设置它的2-4px高度?
6条答案
按热度按时间qlfbtfca1#
因为逻辑上不能强制垂直滚动条为某一 * 高度 (因为由定位的父指定)-因此这样的*
height
属性是以水平滚动条的**高度为目标-并且 * 反之亦然 *(width
用于垂直滚动条的宽度)。uxhixvfz2#
这可能会有帮助
pqwbnv8z3#
cl25kdpy4#
试试这个
js81xvg65#
正如@roco上面提到的,由于垂直滚动条的高度不能修改,那么定义的高度将用于水平条,但单独使用
-webkit-scrollbar
将解决您的问题与水平条,但也会使您的垂直滚动条行为异常,为获得最佳效果,请使用以下代码,注意:-webkit-scrollbar在Firefox或Edge 79之前的版本中不受支持。
zlwx9yxi6#
在
::-webkit-scrollbar selected
中,height表示水平滚动条,width表示垂直滚动条,也可以使用:horizontal
psuedoclass。