css隐藏滚动条但能滚动_【每日一知】CSS滚动条

当网页内容超出100%时会出现滚动条，如下

可以对滚动条进行修改与美化

1，隐藏滚动条

对横向滚动条隐藏

html{  overflow-x: hidden;}

对纵向滚动条进行隐藏

html{  overflow-y: hidden;}

但是要注意的是隐藏滚动条之后那么后面的内容将无法加载出

2，滚动条样式

::-webkit-scrollbar{        width:15px;}                        /*这是针对缺省样式(必须的)*/::-webkit-scrollbar-track{        background-color:#ffcacaff;}                        /*滚动条的滑轨背景颜色*/::-webkit-scrollbar-thumb{        background-color:#D2691E;}                        /*滑块颜色*/::-webkit-scrollbar-button{        background-color:#7c2929;}                        /*滑轨两头的监听按钮颜色*/::-webkit-scrollbar-corner{        background-color:black;}                        /*横向滚动条和纵向滚动条相交处尖角的颜色*/

注：对滚动条样式的修改只适用于webkit浏览器(chrome，Safari，Opera浏览器)，火狐和IE浏览器不适用。