#div1{ 
　　width:200px; 
　　height:400px; 
　　background:red; 
　　overflow:auto;
} 
#div1::-webkit-scrollbar{ 
　　width:5px; 
　　height:5px; 
} 
#div1::-webkit-scrollbar-track{ 
　　background:hotpink; //軌道的樣式 
} 
#div1::-webkit-scrollbar-thumb{ 
　　background:deeppink;  //滑動(dòng)條的樣式 
} 
#div1::-webkit-scrollbar-thumb:hover{ 
　　background:palevioletred; //鼠標(biāo)移到滑動(dòng)條上滑動(dòng)條的樣式 
} 
#div1::-webkit-scrollbar-button{ 
　　background:orange;　　//微調(diào)按鈕的樣式，如下圖中的橙色部分,位于軌道的兩端 
　　border-radius:15px; 
} 
#div1::-webkit-scrollbar-corner{ 
　　background:green; //邊角，即兩個(gè)滾動(dòng)條的交匯處,如下圖中綠色部分 
}   
#div2{ 
　　width:300px; 
　　height:500px; 
　　background:pink; 
}

<div id=’div1’> 
　　<div id=’div2’> 
　　　　1<br/> 
　　　　2<br/> 
　　　　3<br/> 
　　　　4<br/> 
　　　　5<br/> 
　　　　6<br/> 
　　　　7<br/> 
　　</div> 
</div>