【CSS】css 3スクロールバースタイルの変更

1006 ワード

1.スクロールバー構成:-webkit-scrollbarスクロールバー全体部分:-webkit-scrollbar-thumbスクロールバーの中の小さなブロックは、上下に移動(または左に右に移動し、垂直スクロールバーか水平スクロールバーかによって決まる):-webkit-scrollbar-trackスクロールバーの軌道(中にThumbが入っている):-webkit-scrollbar-buttonスクロールバーの軌道の両端ボタン、小さなブロックの位置をクリックして微調整できます.:-Webkit-scrollbar-track-piece内層軌道、スクロールバー中間部(除去):-webkit-scrollbar-corner辺角、すなわち2つのスクロールバーの交差点:-webkit-resizer 2つのスクロールバーの交差点でドラッグによって要素サイズを調整するための小さなコントロール2.簡潔版demo
/*                         */ 
::-webkit-scrollbar 
{ 
    width: 16px; 
    height: 16px; 
    background-color: #F5F5F5; 
} 
   
/*           +  */ 
::-webkit-scrollbar-track 
{ 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px; 
    background-color: #F5F5F5; 
} 
   
/*        +  */ 
::-webkit-scrollbar-thumb 
{ 
    border-radius: 10px; 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3); 
    background-color: #555; 
} 

原文住所:
css 3スクロールバースタイルの変更-lyfのブログ-CSDNブログhttps://blog.csdn.net/qq_37281252/article/details/78963319