純css修改瀏覽器scrollbar滾動條樣式示例
發(fā)布時間：2018-11-23 15:42:56 作者：凱迪Wen 
我要評論
我要評論這篇文章主要介紹了純css修改瀏覽器scrollbar滾動條樣式示例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
使用css修改瀏覽器滾動條樣式
::-webkit-scrollbar {
width: .5rem;
height: .5rem;
background: hsla(0, 0%, 100%, 0.6);
}
::-webkit-scrollbar-track {
border-radius: 0;
}
::-webkit-scrollbar-thumb {
border-radius: 0;
background-color: rgba(95,95,95,.4);
transition: all .2s;
border-radius: .5rem;
&:hover {
background-color: rgba(95,95,95, .7);
}
}
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
相關文章
- 這篇文章主要介紹了CSS 設置滾動條樣式的實例代碼，非常不錯，具有一定的參考借鑒價值，需要的朋友參考下吧2018-07-06
這篇文章主要介紹了css3自定義滾動條樣式寫法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-12-25
本篇文章主要介紹了CSS3自定義滾動條樣式的示例代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-08-21- 這篇文章主要介紹了純CSS改變webkit內核瀏覽器的滾動條樣式,需要的朋友可以參考下2014-04-17
- 使用CSS樣式設置div滾動條，直接充當了文本框的角色，下面為大家介紹下具體的實現(xiàn)，感興趣的朋友可以參考下2013-12-24
本文會介紹CSS滾動條選擇器，并在demo中展示如何在Webkit內核瀏覽器和IE瀏覽器中，自定義一個橫向以及一個縱向的滾動條。具有一定的參考價值，感興趣的小伙伴們可以參考一2018-11-26
