Saya pelatih baharu dan mereka memberi saya tugasan mudah: peribadikan bar skrol mendatar
Saya mempunyai kod ini tetapi bar skrol menegak hilang...saya memerlukannya untuk lalai dalam arah menegak...hanya bar skrol mendatar perlu diperibadikan.
::-webkit-scrollbar {
width: 7px;
}
::-webkit-scrollbar-thumb:horizontal {
border-radius: 8px;
background-color: rgba(92, 92, 92, 0.5);
}
Jika saya meletakkan kod di bawah di tengah, bar skrol menegak juga diperibadikan...jadi saya hanya boleh memperibadikannya atau menyembunyikannya sama sekali...dan saya tidak boleh melakukannya
::-webkit-scrollbar-thumb {
-webkit-appearance: none;
} 
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Berikut ialah contoh cara menggayakan bar skrol mendatar sahaja:
https://codepen.io/lmmm/pen/abKeEJw
Anda boleh menggunakan elemen yang anda ingin gayakan dan menggunakan peraturan anda mengikut keperluan:
#horizontal::-webkit-scrollbar { width: 7px; } #horizontal::-webkit-scrollbar-thumb:horizontal { border-radius: 15px; background-color: tomato; }Anda perlu memautkan penghias pseudo dengan div untuk menggunakan gaya. Ini bermakna ibu jari menegak berasal dari badan atau teg HTML. Ibu jari mendatar adalah untuk div dalam.
#bars-chart-container::-webkit-scrollbar { width: 7px; } #bars-chart-container ::-webkit-scrollbar-thumb:horizontal { border-radius: 8px; background-color: rgba(92, 92, 92, 0.5); }Ini mungkin tidak menghalang ibu jari menegak div dalam daripada hilang, tetapi setakat ini saya nampak dalam imej anda bahawa anda tidak perlu menunjukkannya. Saya tidak fikir ini boleh dicapai dengan cara lain.