<style>
.div1{
width: 400px;
height: 500px;
overflow: scroll;
}
.div1 img{
width: 100%;
/* height: 100px;*/
}
/*只显示纵向height:1px，只显示横向width:1px*/
.div2::-webkit-scrollbar
{
width: 16px; /*滚动条宽度*/
height: 1px; /*滚动条高度*/
}
.div2::-webkit-scrollbar-track {/*滚动条里面轨道颜色*/
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
background: #c9c9c9;
}
/*定义滑块 内阴影+圆角*/
.div2::-webkit-scrollbar-thumb
{
/* border-radius: 10px; */ /*滚动条的圆角*/
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
font-weight:bold;">green; /*滚动条的背景颜色*/
}
</style>
<body>
<div class="div1 div2">
<img src="img/gundong.png" alt="">
</div>
</body>