去除并美化由于overflow产生的滚动条?

 去除overflow产生的滚动条?

.discrible {
    overflow: scroll; 
    -ms-overflow-style: none;   //IE 10+
    overflow: -moz-scrollbars-none;    //Firefox
}
/*整个滚动条样式 当width:0;或display:none;时,滚动条不显示*/
.discrible::-webkit-scrollbar {  
   display:none;
}

去除滚动条默认样式并美化?

.discrible {
    overflow: scroll; 
}
/*整个滚动条样式*/
.discrible::-webkit-scrollbar {  
    width: 6px; 
    height: 0px;
}
/*设置滚动条上的滚动滑块样式*/
.discrible::-webkit-scrollbar-thumb {
    background: transparent;
}
/*鼠标位于内容上时,滚动条样式*/
.discrible:hover::-webkit-scrollbar {
    width: 6px;
    height: 0px;
    background: rgba(238, 238, 238, 1);
    border-radius: 6px;
}
/*鼠标位于内容上时,滚动滑块样式*/
.discrible:hover::-webkit-scrollbar-thumb {
    background: #9bcaff;
    border-radius: 10px;
}

 

 

 

发布了24 篇原创文章 · 获赞 3 · 访问量 2万+

猜你喜欢

转载自blog.csdn.net/sunny123x/article/details/84800888