使用element-ui的滚动条

在项目中引入element-ui后，发现在不同的浏览器显示并不一样，为了统一浏览器中的样式，统一使用了element-ui库中的滚动条。使用方法如下：
直接使用el-scrollbar的组件将你需要的有滚动条的内容包裹起来即可。这里必须设置里面盒子的固定高度（最好是设置最大高度），不然不会有效果！若内容长度不超出屏幕宽度，则不会出现横向滚动条。

.inner{
	max-height:200px;
}

1.把想要出滚动条的内容放在下边标签里即可：

<el-scrollbar style="height:100%;width:100%">

</el-scrollbar>

2.如果不想要横向的滚动条，添加css：

.el-scrollbar__wrap {
  overflow-x: hidden;
}

3.如果相让滚动条一直显示而不是鼠标移入才显示，添加css：

.el-scrollbar__bar.is-vertical {
  opacity: 1;
}

4.微调滚动条的位置以及宽度：

.el-scrollbar__bar.is-vertical {
  opacity: 1;
  padding-right: 5px;
  width: 7px;
}

5.设置横向滚动条
我们也可以直接设置el-scrollbar的组件宽度，这样超出宽度的时候自然就会出现横向滚动条。

注意是给el-scrollbar组件设置宽度，而不是里面的内容设置。

.el-scroll{
	width:200px;
}

6.其余设置：
element-ui的滚动条

注意：当然也有不使用element-ui库的滚动条设计方法（这种方法相对复杂）：
原生设置

/* 外层div设置如下 */
.cell-with-scroll {
  max-height: 200px; /* 设置单元格的最大高度 */
  overflow-y: auto; /*当内容超出时，显示垂直滚动条 */
  overflow-x: hidden; /*隐藏水平滚动条*/
}