table 滚动时固定表头

表格内容过多时，仅滚动数据，表头不动

  table {
    height: 100%;
    overflow: auto;
    table-layout: fixed;
    display: block;
 
    & > thead {
      position: sticky;
      top: 0;
      left: 0;
      right: 0;
      display: table;
      width: 100%;
      table-layout: fixed;
      z-index: 1;
    }
 
    & > tbody {
      display: table;
      width: 100%;
      table-layout: fixed;
    }
  }

 表格html：

<table>
  <thead>
    <tr>
      <th width="50px">th>
      
    tr>
  thead>
  <tbody>
    <tr v-if="tableData.length">
      <td width="50px">td>
      
    tr>
    <tr v-else>
      <td colspan="5" style="text-align: center;">暂无数据td>
    tr>
  tbody>
table>