如何自定义浏览器滚动条样式

如题所述

举报该文章

相关建议 2016-06-14

body{

scrollbar-base-color: #C0C0C0;

scrollbar-3dlight-color: #C0C0C0;

scrollbar-highlight-color: #C0C0C0;

scrollbar-track-color: #EBEBEB;

scrollbar-arrow-color: black;

scrollbar-shadow-color: #C0C0C0;

scrollbar-dark-shadow-color: #C0C0C0;

}

åå«å¯¹åºæ»å¨æ¡ä½ç½®

æµè¯ï¼

.wrapper2 {

width: 400px;

overflow-x: scroll;

overflow-y: hidden;

scrollbar-base-color: #1C86EE;

scrollbar-3dlight-color: #1C86EE;

scrollbar-highlight-color: #1C86EE;

scrollbar-track-color: #EBEBEB;

scrollbar-arrow-color: black;

scrollbar-shadow-color: #1C86EE;

scrollbar-dark-shadow-color: #1C86EE;

}

<tbody>

<tr>

<td>table cell</td>

...

</tr>

</tbody>

</table>

</div>

ææï¼

温馨提示：内容为网友见解，仅供参考

当前网址：https://11.t2y.org/zz/ppq2mfp78f8p7ps7f77.html

其他看法

第1个回答 2016-05-30

第一种是利用Javascript模拟滚动条，然后将它的样式渲染改变，方法和代码比较多，也比较复杂，一般这样的方法都会制作成插件，也附带使用方法，可以在网络上搜索“Javascript自定义滚动条”找到。
第二种是使用CSS来自定义滚动条的样式。CSS代码如下：
<style type=text/css<!--html,
body {scrollbar-face-color: #f892cc;
scrollbar-highlight-color: #F00;scrollbar-shadow-color: #FFF;
可以试试看看上面的办法本回答被网友采纳

第2个回答 2016-05-30

第一种是利用Javascript模拟滚动条，然后将它的样式渲染改变，方法和代码比较多，也比较复杂，一般这样的方法都会制作成插件，也附带使用方法，可以在网络上搜索“Javascript自定义滚动条”找到。
第二种是使用CSS来自定义滚动条的样式。CSS代码如下：
<style type=text/css<!--html,
body {scrollbar-face-color: #f892cc;
scrollbar-highlight-color: #F00;scrollbar-shadow-color: #FFF;