預設滾動條樣式如下:
那如何修改呢?如下**:
這是內容111
這裡是內容222
這裡是內容333
.inner
.innerbox
/*滾動條樣式*/
.innerbox::-webkit-scrollbar
.innerbox::-webkit-scrollbar-thumb
.innerbox::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
border-radius: 0;
background: rgba(0,0,0,0.1);
效果顯示如圖:
下面就講解滾動條幾個屬性,主要有下面7個屬性
::-webkit-scrollbar 滾動條整體部分,可以設定寬度啥的
::-webkit-scrollbar-button 滾動條兩端的按鈕
::-webkit-scrollbar-track 外層軌道
::-webkit-scrollbar-track-piece 內層滾動槽
::-webkit-scrollbar-thumb 滾動的滑塊
::-webkit-scrollbar-corner 邊角
::-webkit-resizer 定義右下角拖動塊的樣式
css修改滾動條樣式
修改滾動條樣式 div webkit scrollbar div webkit scrollbar track div webkit scrollbar thumb div webkit scrollbar thumb hover div webkit scrollbar corner webkit...
css修改滾動條樣式
修改滾動條樣式 div webkit scrollbar div webkit scrollbar track div webkit scrollbar thumb div webkit scrollbar thumb hover div webkit scrollbar corner webkit...
css修改滾動條樣式
修改滾動條樣式 div webkit scrollbar div webkit scrollbar track div webkit scrollbar thumb div webkit scrollbar thumb hover div webkit scrollbar corner webkit...