由于windows自带滚动条比较丑,而手动写css并没有兼容火狐的方案,这里就使用到element的隐藏组件,看css样式可以看到这是一个手动书写的滚动条,完美的兼容了各大浏览器,使用方法如下:
<div style="height: 100px; width: 80px">
<el-scrollbar style="height: 100%">
<p>111111111111111111</p>
<p>111111111111111111</p>
<p>111111111111111111</p>
<p>111111111111111111</p>
<p>111111111111111111</p>
<p>111111111111111111</p>
<p>111111111111111111</p>
</el-scrollbar>
</div>
这样写在观看效果是会出现横向滚动条,隐藏方式:
.el-scrollbar__wrap {
overflow-x: hidden;
}
效果图如下: