使用css修改瀏覽器滾動(dòng)條樣式
::-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); } }
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://m.hztianpu.com/yun/114265.html
使用css修改瀏覽器滾動(dòng)條樣式 showImg(https://segmentfault.com/img/bVbjQ9D); ::-webkit-scrollbar { width: .5rem; height: .5rem; background: hsla(0, 0%, 100%, 0.6); } ::-webkit-scrollbar-track { border-radi...
摘要:滾動(dòng)條的背景滾動(dòng)條的滑塊樣式修改這個(gè)算很齊全的修改下邊這個(gè)很精簡。值得一試這個(gè)的優(yōu)點(diǎn)在于鼠標(biāo)移上才會(huì)顯示修改的滾動(dòng)條體驗(yàn)很好提示下隱藏某軸的滾動(dòng)條代碼寫法之前我以為是半天沒變化 前端項(xiàng)目修改默認(rèn)滾動(dòng)條樣式 寫過挺多項(xiàng)目都需要改變滾動(dòng)條的默認(rèn)樣式 并不想單獨(dú)下載和引入插件 因此純css修改默認(rèn)滾動(dòng)條的樣式 這次算統(tǒng)一整理下方法,直接上代碼。 &::-webkit...
摘要:滾動(dòng)條的背景滾動(dòng)條的滑塊樣式修改這個(gè)算很齊全的修改下邊這個(gè)很精簡。值得一試這個(gè)的優(yōu)點(diǎn)在于鼠標(biāo)移上才會(huì)顯示修改的滾動(dòng)條體驗(yàn)很好提示下隱藏某軸的滾動(dòng)條代碼寫法之前我以為是半天沒變化 前端項(xiàng)目修改默認(rèn)滾動(dòng)條樣式 寫過挺多項(xiàng)目都需要改變滾動(dòng)條的默認(rèn)樣式 并不想單獨(dú)下載和引入插件 因此純css修改默認(rèn)滾動(dòng)條的樣式 這次算統(tǒng)一整理下方法,直接上代碼。 &::-webkit...
閱讀 2485·2021-11-23 10:04
閱讀 1570·2021-09-02 15:21
閱讀 947·2019-08-30 15:44
閱讀 1116·2019-08-30 10:48
閱讀 770·2019-08-29 17:21
閱讀 3632·2019-08-29 13:13
閱讀 2037·2019-08-23 17:17
閱讀 1842·2019-08-23 17:04