css将滚动条滚动且隐藏ie

在Web开发中，我们经常会遇到需要滚动条滚动的情况。而CSS中提供了一种样式可以让我们定制滚动条，使其与页面的整体风格更协调。

但是需要注意的是，IE浏览器对于自定义滚动条的支持并不是很友好，因此我们需要在CSS中进行一些特定的处理，以达到隐藏IE滚动条的效果。

/*针对火狐、Safari、Chrome等浏览器*/
::-webkit-scrollbar {
    width: 10px; /*滚动条的宽度*/
    height: 10px; /*滚动条的高度*/
}

/*指定滚动槽的样式*/
::-webkit-scrollbar-track {
    background-color: #F5F5F5; /*滚动槽的底色*/
}

/*指定滚动条的样式*/
::-webkit-scrollbar-thumb {
    background-color: #000000; /*滚动条的颜色*/
    border-radius: 10px; /*滚动条的圆角*/
}

/*隐藏IE滚动条，注意需要在body中添加属性*/
body {
    scrollbar-arrow-color: transparent; /*滚动条箭头的颜色*/
    scrollbar-face-color: transparent; /*滚动条前景色*/
    scrollbar-highlight-color: transparent; /*滚动条高亮颜色*/
    scrollbar-shadow-color: transparent; /*滚动条阴影颜色*/
    scrollbar-track-color: transparent; /*滚动槽的颜色*/
    overflow-y: scroll; /*垂直滚动条*/
}

以上代码中，::-webkit-scrollbar和::-webkit-scrollbar-track以及::-webkit-scrollbar-thumb是针对Webkit内核的浏览器，比如Safari、Chrome等。我们可以通过这些样式对滚动条的宽度、高度、底色和颜色等进行设置，以满足自己的需求。

而IE浏览器则需要在body中添加一些特定的CSS属性，以达到隐藏滚动条的效果，并同时启用垂直滚动。

综上所述，CSS提供了丰富的滚动条样式属性，我们可以根据不同的情况进行设置，使得页面更美观、更易于使用。