滚动条CSS样式控制浏览器滚动条颜色的代码

制作网站的时侯为了美化网站界面,大家都希望把浏览器右边的滚动条修改一下颜色,这个通过修改网页代码是实现不了的,我们需要借助CSS来控制滚动条的样式。


    如果想修改浏览器滚动条的颜色,我们可以把下面的代码插入到CSS里,这样就可以让滚动条变色。


    代码如下: (放在body里,不行就放在html标签里。)

      scrollbar-face-color:#dddddd;   /*浏览器右边滚动条凸出部分的颜色*/
      scrollbar-highlight-color:#ffffff;   /*浏览器右边滚动条空白部分的颜色*/

      scrollbar-shadow-color:#ffffff;    /*浏览器右边立体滚动条阴影的颜色*/

      scrollbar-3dlight-color:#eeeeee;   /*浏览器右边滚动条亮边的颜色*/

      scrollbar-arrow-color:#eeeeee;    /*浏览器右边滚动条上下按钮上三角箭头的颜色*/

      scrollbar-track-color:#f7f7f7;      /*浏览器右边滚动条的背景颜色*/

      scrollbar-darkshadow-color:#eeeeee;   /*滚动条强阴影的颜色*/

    如:

      body{xxx;xxx;} 或者 html{xxx;xxx;}

      常用效果:

 scrollbar-highlight-color: #008000;
 scrollbar-shadow-color: #008000;
 scrollbar-3dlight-color: #000000;
 scrollbar-arrow-color: #000000;
 scrollbar-track-color: #000000;
 scrollbar-darkshadow-color: #000000;
 scrollbar-face-color: #000000;

                -----------

 

 

    图解:

        

      把这些代码插入到CSS当中,然后你就会看到你的网站所在的浏览器滚动条颜色变化了,是不是很漂亮呢?

转载于:https://www.cnblogs.com/clouds008/archive/2012/05/14/2499401.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值