Properties for document promptsshow-header
<el-table :data="tableData1" :span-method="arraySpanMethod" border :show-header="status" <el-table-column prop="lable" label="" width="180"> </el-table-column> /el-table >
!!! The key point is: show-header dynamic control
Element-ui table removes all borders
el-table add class="customer-no-border-table"
/*Remove table cell border*/ .customer-no-border-table th{ border:none; } .customer-no-border-table td,.customer-no-border-table -leaf { border:none; } /*The outermost border of the table*/ .customer-no-border-table .el-table--border, .el-table--group{ border: none; } /*Head border*/ .customer-no-border-table thead tr -leaf{ border: 0px solid #EBEEF5; border-right: none; } .customer-no-border-table thead tr th:nth-last-of-type(2){ border-right: 0px solid #EBEEF5; } /*The outermost border of the table - the bottom border*/ .customer-no-border-table .el-table--border::after,.customer-no-border-table .el-table--group::after{ width: 0; } .customer-no-border-table::before{ width: 0; } .customer-no-border-table .el-table__fixed-right::before,.el-table__fixed::before{ width: 0; } .customer-no-border-table .el-table__header tr th{ background: #fff; color: #333333 ; padding: 3px ; fontWeight: 550 ; height: 36px ; border: 0px; font-size: 15px; }
This is the end of this article about the implementation method of removing the header of the element table. For more relevant element table contents, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!