各位程序员同学们，现在许多项目中需要使用滚动条，在某些情况下，使用模拟滚动条。许多大型邮箱都是使用CSS样式设置的div滚动条宽度，那么CSS如何设置滚动条的宽度呢，下面就给大家说一说：

    可以在CSS中使用::-webkit-scrollbar伪类选择器来设置滚动条样式. 在此伪类选择器中，可以通过width属性设置滚动条的宽度。可以使用以下伪元素选择器来修改各种Webkit浏览器的滚动条样式:

/*滚动条样式*/

.cal_bottom::-webkit-scrollbar {/*滚动条整体样式*/

width:4px;/*高宽分别对应横竖滚动条的尺寸*/

height:4px;

}

.cal_bottom::-webkit-scrollbar-thumb {/*滚动条里面小方块*/

border-radius:5px;

-webkit-box-shadow: inset005pxrgba(0,0,0,0.2);

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

}

.cal_bottom::-webkit-scrollbar-track {/*滚动条里面轨道*/

-webkit-box-shadow: inset005pxrgba(0,0,0,0.2);

border-radius:0;

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

}

    以上便是关于html滚动条设置宽度的全部内容，有关更多详细信息div滚动条宽度，请关注慕课网其他文章~