关于css3:css修改浏览器滚动条样式

一、滚动条相干的属性

::-webkit-scrollbar                 滚动条整体局部，罕用属性：width,height,background,border；::-webkit-scrollbar-button          滚动条两边的按钮，默认不设置时不显示，可设置高度、背景色、背景图片；::-webkit-scrollbar-track           整个滚动条去除两边按钮剩下的局部；::-webkit-scrollbar-track-piece     track去掉拖拽剩下的局部；::-webkit-scrollbar-thumb           滚动条外面能够拖动的那局部；::-webkit-scrollbar-corner          边角；::-webkit-resizer                   定义右下角拖动块的款式

二、根底改变，上例子

<div class="box">  <div>1fnreknenverknrefnrenfengrnengej1fnreknenverknrefnrenfengrnengejk1fnreknenverknrefnrenfengrnengejk1fnreknenverknrefnrenfengrnengejkk</div>  <div>1</div>  <div>1</div>  <div>1</div>  <div>1</div>  <div>1</div>  <div>1</div>  <div>1</div>  <div>1</div>  <div>1</div></div>

.box {  width: 300px;  height: 100px;  overflow: scroll;}div::-webkit-scrollbar {  width: 8px; /* 纵向滚动条的宽 */  height: 8px; /* 横向滚动条的高 */}div::-webkit-scrollbar-thumb {  border-radius: 4px;  background: #EBEBEB;}

三、成果

注：只对 设置了高度和滚动成果的容器 失效