css - 滚动条样式修改

修改浏览器滚动条样式

::-webkit-scrollbar {
    width:8px; 
    height:14px; 
}
::-webkit-scrollbar-button {
    display:none;
}
::-webkit-scrollbar-track, ::-webkit-scrollbar-track-piece {
    background:-webkit-gradient(linear, left top, right top, from(#f6f6f6), color-stop(50%, #fff), color-stop(75%, #fff), to(#fdfdfd));
    width:11px;
    height:11px;
}
::-webkit-scrollbar-thumb {
    border-width:0;
    border-style:solid;
    border-radius:6px;
    background:#d9d9d9;
}
::-webkit-scrollbar-thumb:horizontal {
    border-width:3px 0;
    border-style:solid;
    border-color:#fefefe;
    border-radius:6px;
    background:#d9d9d9;
}
::-webkit-scrollbar-thumb:hover {
    background:#bdbdbd;
}
::-webkit-scrollbar-thumb:active {
    background:#8e8e8e;
}

滚动条效果图

滚动条效果