windows系统中火狐浏览器滚动条很粗,且颜色在很多场景很辣眼睛,并不适用,现提供以下几种方式,对滚动条进行优化:
1.直接隐藏法(体验最差)
// 火狐64+
scroll-width: none
// 谷歌
::-webkit-scrollbar {
display: none
}
2.引用第三方插件(有弊端)
相关插件推荐
el-scrollbar(element自带的,但是没有在文档中写出)
vue-scroll
vue-happy-scroll
better-scroll
由于引用第三方插件后,在mac中浏览器自动又添加了优化的滚动条,会重叠,看起来不是很友好
3.css自带(最方便好用)
主要针对火狐64+
scrollbar-width: thin; // 滚动条窄形式
scrollbar-color: #5A5B5C transparent; // 滚动条颜色 背景颜色
样式看起来也还不错
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。