前端 頁面自定義滾動條

示例

代碼

<div class="p-detail__table-scrollbar">
    <div style="width: 3300px;height: 10px;">
    </div>
</div>

<style>
.p-detail__table-scrollbar{
    overflow-x: scroll;
    overflow-y: hidden;
}
.p-detail__table-scrollbar::-webkit-scrollbar{
    width:1px;
    height: 10px;
    background-color: #ccc;
    border-radius: 5px;
}
.p-detail__table-scrollbar::-webkit-scrollbar-track{
    border-radius: 5px;
}
.p-detail__table-scrollbar::-webkit-scrollbar-thumb{
    border-radius: 5px;
    background-color: #333;
}
</style>