overflow:scroll滚动条样式修改

第一,在需要加滚动条的元素上加上overflow: scroll,并设置高度!
如:

<div><p class="AddStyle">213131321231312331312313131231212313123123123131231231</p></div>

我需要给p标签加入滚动条!代码如下!

.AddStyle{
overflow: scroll;height: 600px;
}

第二,现在p标签如果超出高度为600px的时候就有滚动条显示了!接下来修改样式!

.AddStyle::-webkit-scrollbar
{
    /*滚动条整体样式*/
    width: 8px;     /*高宽分别对应横竖滚动条的尺寸*/  height: 1px;
}
.AddStyle::-webkit-scrollbar-thumb
{
    /*滚动条里面小方块*/
    border-radius: 10px;  background: #9e9e9e;  box-shadow: inset 0 0 5px rgba(0, 122, 204);
}
//滚动条底层颜色!
.AddStyle::-webkit-scrollbar-track
{
    border-radius: 10px;  background: #ededed;

/*滚动条里面轨道*/
    box-shadow: inset 0 0 5px rgba( 0, 0, 0, .1);
}