100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > React设置自定义滚动条样式

React设置自定义滚动条样式

时间:2018-10-02 05:59:49

相关推荐

React设置自定义滚动条样式

1、全局配置

在global.less文件添加如下配置

/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/::-webkit-scrollbar {width: 5px;height: 10px;}/*定义滑块 内阴影+圆角*/::-webkit-scrollbar-thumb {background: rgba(0,0,0,0.2);border-radius: 10px;}/*定义滚动条轨道 内阴影+圆角*/::-webkit-scrollbar-track {border-radius: 10px;}

2、局部配置

在页面内部组件样式中,使用global配置

.sectionLeft{width: 12%;height: 100%;overflow: hidden;background-color: #fff;border-radius: 5px;:global {::-webkit-scrollbar {width: 5px;height: 10px;}::-webkit-scrollbar-thumb {background: rgba(0,0,0,0.1);border-radius: 10px;}::-webkit-scrollbar-track {border-radius: 10px;}}}

新时代农民工

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。