CSS自定义滚动条样式

简介: CSS自定义滚动条样式

代码

.ztree {
  background: #0b2b5f;
  padding-top: 10px;
  height: 689px;
        overflow: auto;
}
.ztree::-webkit-scrollbar {/*滚动条整体样式*/
        width: 10px;     /*高宽分别对应横竖滚动条的尺寸*/
        height: 1px;
    }
.ztree::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
        border-radius: 10px;
         -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
        background: #000080;
    }
.ztree::-webkit-scrollbar-track {/*滚动条里面轨道*/
        -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
        border-radius: 10px;
        background: #EDEDED;
}
相关文章
|
1月前
|
前端开发
web前端开发-----CSS样式设置
web前端开发-----CSS样式设置
33 0
|
1月前
|
前端开发 JavaScript
css之伪类hover改变自身、子元素、其他元素的样式
css之伪类hover改变自身、子元素、其他元素的样式
28 0
|
1月前
|
前端开发 JavaScript
webpack成长指北第7章---webpack的css\less\scss样式打包
webpack成长指北第7章---webpack的css\less\scss样式打包
42 0
|
3月前
|
前端开发 JavaScript
如何固定html表格头部,用css样式即可实现,操作简便、代码简单
如何固定html表格头部,用css样式即可实现,操作简便、代码简单
29 0
|
17天前
|
前端开发
|
20天前
|
移动开发 前端开发
【通用CSS模板】移动端H5页面统一样式.css
【通用CSS模板】移动端H5页面统一样式.css
|
24天前
|
XML 前端开发 数据格式
css添加样式
【4月更文挑战第4天】css添加样式
21 9
|
1月前
|
JavaScript 前端开发
如何在 Vue 中进行样式绑定和scoped CSS?
如何在 Vue 中进行样式绑定和scoped CSS?
15 0
|
1月前
|
前端开发
uni-app中基于bootstrap的css样式
uni-app中基于bootstrap的css样式
23 0
|
1月前
|
前端开发 开发者
编程笔记 html5&css&js 017 HTML样式
编程笔记 html5&css&js 017 HTML样式