你的 banner 是整张图片还是背景和图片分开的？
理论上背景和上面文字内容分开的话会比较好一点，节省资源。
当然如果不是分开的也可以。
【解决方法】你要把 banner 当做背景图片来看待，也就是在 CSS 里定义 background，直接确定位置 center 就可以了。
【原因】会出现滚动条的原因应该是图片宽造成的。
比如，我用了一个 2000*470 的图片，理论上这个图片放在浏览器上以后肯定是要出现横向滚动条的，那现在直接把你做好的图片当做背景来处理：
.banner {background:url(file:///L|/I_web/images/study/bannerai.jpg) center
}
然后，看你的图片是怎么做的。刚才我说如果你的图片和背景是分开独立的话：
<div class="banner"><img src="file:///L|/I_web/images/study/picture.png" />
</div>
如果不是分开的，而是整张图片的话，就不需要再给 img 标签
直接div 调用 banner 样式就可以：
<div class="banner"> 
</div>
【注意】我随便放了个 url 的地址，这个你要根据你图片的位置改一下；
css 部分你原来的还是不变，或者根据实际效果将位置稍作调整
css操作滚动条：::-webkit-scrollbar-track {
background-color: #b46868
} /* 滚动条的滑轨背景颜色 */
::-webkit-scrollbar-thumb {
background-color: rgba(0, 0, 0, 0.2)
} /* 滑块颜色 */
::-webkit-scrollbar-button {
background-color: #7c2929
} /* 滑轨两头的监听按钮颜色 */
::-webkit-scrollbar-corner {
background-color: black
} /* 横向滚动条和纵向滚动条相交处尖角的颜色 */
