如何使表头始终位于顶部

Question

我正试图使表头始终位于Element UI的顶部。我尝试过经典css的解决方案，比如：position: stiky;forth，但它不适用于Element UI。表格将继续滚动其标题。

这是我的代码https://jsfiddle.net/wb06nm51/

Answer 1

有两种方法可以实现这一点。

首先按照元素ui指定的方式，在el表上指定表的高度：https://element.eleme.io/#/en-US/组件/表#表，带有固定标题

第二种方法是像以前一样使用css，但您必须考虑到元素ui创建了两个表，一个表用于表头，一个为表体。必须应用的正确css如下：

.el-table__header-wrapper {
z-index: 100;
position: fixed;
top: 0;
}
// Neede to show the first row in the table
.el-table__body-wrapper {
margin-top: 50px;
}

要使它在你的小提琴工作，请确保你也导入正确的css：

@import url("//unpkg.com/element-ui@2.13.0/lib/theme-chalk/index.css");