首先写一个div,设置宽高,overflow-x;overflow-y:auto,如图:

<div class="s_box">
<p>滚动条测试1</p>
<p>滚动条测试2</p>
<p>滚动条测试3</p>
<p>滚动条测4试</p>
<p>滚动条测试5</p>
<p>滚动条测试6</p>
<p>滚动条测试7</p>
<p>滚动条测试8</p>
<p>滚动条测试9</p>
<p>滚动条测试10</p>
<p>滚动条测试11</p>
<p>滚动条测试12</p>
<p>滚动条测试13</p>
<p>滚动条测试14</p>
<p>滚动条测试15</p>
<p>滚动条测试16</p>
<p>滚动条测试17</p>
<p>滚动条测试18</p>
</div>
然后通过css改变默认滚动条的样式
.s_box{
width:130px;
height:200px;
background:#FC9;
margin:0 auto;
overflow-x:hidden;
overflow-y:auto;
scrollbar-face-color: #8e8e8e;
scrollbar-arrow-color: #efefef;
scrollbar-3dlight-color: #b8b19c;
scrollbar-highlight-color: #b1b1b1;
scrollbar-shadow-color: #898989;
scrollbar-darkshadow-color: #898989;
scrollbar-track-color: #ffffff;
scrollbar-base-color: #b8b19c;
}
scrollbar-face-color: #f00;改变滚动条本身,如图:

scrollbar-arrow-color: #f00;改变小三角的颜色,如图:

scrollbar-3dlight-color: #f00;改变左侧外边线的颜色,如图:

scrollbar-highlight-color: #f00;改变左侧内边线的颜色,如图:

scrollbar-shadow-color: #f00;改变右侧内边线的颜色,如图:

scrollbar-darkshadow-color: #f00;改变右侧外边线的颜色,如图:

scrollbar-track-color: #f00;改变滚动条剩余部分的颜色,如图:

scrollbar-base-color: #b8b19c;