如何更改滚动条的拇指高度？

Question

谁能告诉我如何调整滚动条拇指的高度？

我尝试了很多不同的东西，比如

::-webkit-scrollbar-thumb {
    height: 10px;
}

::-webkit-scrollbar-thumb {
    max-height: 200px;
}

::-webkit-scrollbar-thumb {
    margin-top: 10px;
    margin-bottom: 10px;
}

我也读过这个答案Change scrollbar height 和How to change the height of a scrollbar thumb?，但它没有用。有人回答说不能改变滚动条拇指的高度那么这个网站https://css-tricks.com/custom-scrollbars-in-webkit/是怎么做到的？

我当前的代码是

body {
  height: 110vh;
}

::-webkit-scrollbar {
    width: 1rem;
}

::-webkit-scrollbar-track {
    background: rgb(24, 24, 24);
}

::-webkit-scrollbar-thumb {
    background-color: #3EECAC;
    background-image: linear-gradient(19deg, #3EECAC 0%, #EE74E1 100%);
    border-radius: 1rem;
}

Answer 1

那么你的浏览器不支持它：

问这个：

你在火狐上吗？

stackoverflow 中的滚动条是否变化：Change scrollbar height

（答案滚动条会改变吗？）

::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 7px;
}

::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background-color: rgba(0, 0, 0, .5);
  box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}
h1 {
  font-size: 1000px;
}

<h1>Test</h1>