在網頁設計中，滾動條是一個非常重要的元素。它可以幫助用戶輕松地在頁面上查看內容。然而，有些時候我們希望自定義滾動條的樣式，以此打造更美觀的頁面，但是它可能會引起滾動條消失的問題。

/* 隱藏默認滾動條 */
::-webkit-scrollbar {
width: 0;
height: 0;
}
/* 自定義滾動條樣式 */
.scrollbar {
width: 12px;
height: 12px;
background-color: #F5F5F5;
border-radius: 8px;
border: 2px solid #E0E0E0;
}
/* 自定義滾動條滑塊樣式 */
.scrollbar-thumb {
height: 50px;
background-color: #BDBDBD;
border-radius: 8px;
}
/* 隱藏滾動條上的按鈕 */
.scrollbar-button {
display: none;
}

以上代碼中，我們首先使用偽元素選擇器::-webkit-scrollbar隱藏了默認的滾動條，并將其寬度和高度設置為0，這樣就看不到原本的滾動條了。接下來，我們通過添加一個div元素，為自定義滾動條設置樣式，包括樣式名為.scrollbar和.scrollbar-thumb的滾動條和滑塊。最后，我們使用樣式名為.scrollbar-button的按鈕來隱藏滾動條上的按鈕。

使用上述代碼，我們可以自定義滾動條的樣式，從而為網頁帶來更美觀的效果。需要注意的是，由于本代碼主要針對WebKit引擎，如果你使用的是其他瀏覽器，則需要更改對應的前綴。