滾動條css樣式修改
Chrome 71.0.3578.99以上版本適用,以下不適用: /* 设置滚动条的样式 */ .content_area ul::-webkit-scrollbar { width:12px; } /* 滚动槽 */ .content_area ul::-webkit-scrollbar-track { -webkit-box-shadow:inset006pxrgba(0,0,0,0.8); border-radius:10px; background:rgba(0, 0, 0, .8); } /* 滚动条滑块 */ .content_area ul::-webkit-scrollbar-thumb { border-radius:10px; background:rgba(255,255,255) !important; -webkit-box-shadow:inset006pxrgba(0,0,0,0.5); } .content_area ul::-webkit-scrollbar-thumb:window-inactive { background:rgba(255,0,0,0.4); } safari瀏覽器可用niceScroll.js代替。 案例:Chrome 用css修改,再寫userAgent,safari用niceScroll.js。 /* 滚动条ie */ .modal-body{ scrollbar-base-color: #144190; scrollbar-face-color: #ffda2e; scrollbar-3dlight-color: #144190; scrollbar-highlight-color: #144190; scrollbar-track-color: #144190; scrollbar-shadow-color: #144190; scrollbar-dark-shadow-color: #144190; }