滚动条样式

曼玉伽华

我想修改页面滚动条的样式，我之前在网上找到一些代码没有用，大神帮忙看看吧
body::-webkit-scrollbar-track-piece {
  background-color: white;
}


::-webkit-scrollbar-thumb {
  background-color: #3994EF;
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #A4EEF0;
}

::-webkit-scrollbar-thumb:active {
  background-color: #666;
}

jishuang

css样式定位调试参考http://docs.wex5.com/css-debug/
修改系统样式参考http://doc.wex5.com/?p=4827#2.1

曼玉伽华

jishuang 发表于 2017-6-29 14:09
css样式定位调试参考http://docs.wex5.com/css-debug/
修改系统样式参考http://doc.wex5.com/?p=4827#2.1 ...

我利用开发者工具审查元素，并不能找到滚动条这个控件，所以我不会修改，另外我在网上找到的关于scrollbar的css也不能对咱们平台起作用，所以就问这个滚动条的样式能不能修改

jishuang

请仔细看修改样式样式的链接

1. /*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/  
   
2. ::-webkit-scrollbar  
   
3. {  
   
4.     width: 16px;  
   
5.     height: 16px;  
   
6.     background-color: red  
   
7. }  
   
8.   
   
9. /*定义滚动条轨道 内阴影+圆角*/  
   
10. ::-webkit-scrollbar-track  
    
11. {  
    
12.     -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);  
    
13.     border-radius: 10px;  
    
14.     background-color: red;  
    
15. }  
    
16.   
    
17. /*定义滑块 内阴影+圆角*/  
    
18. ::-webkit-scrollbar-thumb  
    
19. {  
    
20.     border-radius: 10px;  
    
21.     -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);  
    
22.     background-color: green;  
    
23. }  

复制代码

曼玉伽华

已解决，是我放的位置不对

淡陌

曼玉伽华 发表于 2017-6-29 16:40
已解决，是我放的位置不对

楼主，你把相关的样式放在哪个文件夹下？

曼玉伽华

淡陌 发表于 2017-7-21 08:59
楼主，你把相关的样式放在哪个文件夹下？

你好，很抱歉很久没有打开论坛，我把样式放在了所有的样式集合的总样式内

淡陌

曼玉伽华 发表于 2017-8-7 11:18
你好，很抱歉很久没有打开论坛，我把样式放在了所有的样式集合的总样式内 ...

你好，我找到了，在portal_X/pc3/AdminLTE/css/AdminLTE.min.css这个文件里，谢谢楼主