vue中如何修改滚动条的整体长度？

Question

如图，想修改横向滚动条的整体长度

目前我使用css伪类选择器只能修改颜色和宽度之类的，长度修改不了，效果如下图

/* 设置滚动条的样式 */
        ::-webkit-scrollbar {
          width: 4px;
          height: 4px;
        }
        /* 滚动槽 */
        ::-webkit-scrollbar-track {
          border-radius: 2px;
          background: #f4f4fa;
        }
        /* 滚动条滑块 */
        ::-webkit-scrollbar-thumb {
          border-radius: 2px;
          background: #da1572;
        }

有什么方法能修改长度吗？

Answer 1

::-webkit-scrollbar-thumb {
  width: 100px; // 改这里试试
  border-radius: 2px;
  background: #da1572;
}