css改变滚动条样式


当前第2页 返回上一页

CSS也很简单,例:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

/* 设置滚动条的样式 */

::-webkit-scrollbar {

width:12px;

}

/* 滚动槽 */

::-webkit-scrollbar-track {

-webkit-box-shadow:inset006pxrgba(0,0,0,0.3);

border-radius:10px;

}

/* 滚动条滑块 */

::-webkit-scrollbar-thumb {

border-radius:10px;

background:rgba(0,0,0,0.1);

-webkit-box-shadow:inset006pxrgba(0,0,0,0.5);

}

::-webkit-scrollbar-thumb:window-inactive {

background:rgba(255,0,0,0.4);

}

【推荐学习:css视频教程】

二、IE下面的CSS设置滚动条

IE下面就比较简单那了,自定义的项目比较少,全是颜色。

  • scrollbar-arrow-color: color; /三角箭头的颜色/
  • scrollbar-face-color: color; /立体滚动条的颜色(包括箭头部分的背景色)/
  • scrollbar-3dlight-color: color; /立体滚动条亮边的颜色/
  • scrollbar-highlight-color: color; /滚动条的高亮颜色(左阴影?)/
  • scrollbar-shadow-color: color; /立体滚动条阴影的颜色/
  • scrollbar-darkshadow-color: color; /立体滚动条外阴影的颜色/
  • scrollbar-track-color: color; /立体滚动条背景颜色/
  • scrollbar-base-color:color; /滚动条的基色/

以上就是css改变滚动条样式的详细内容,更多文章请关注木庄网络博客

返回前面的内容

相关阅读 >>

怎么设置css字体单行居中

css的属性有哪些

css怎么设置透明度的颜色

怎样用css实现无缝轮播图切换?

css怎么设置字体发光效果

css border-collapse属性怎么用

css 如何实现让文字滑入的方式

怎样清除内嵌css样式

css如何让文字有阴影

css如何改字体

更多相关阅读请进入《css》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...