el-table去除底部横线
时间: 2023-11-24 19:48:45 浏览: 58
在Element UI组件Table中,添加border属性可以增加纵向边框,但是无法控制横线边框,因此即使是最简单的el-table,也会包含一个底部横线。要去除底部横线,可以通过修改样式来实现。具体方法如下:
在style标签中添加如下样式即可:
table th,table td {border-bottom: none !important;}
.el-table::before {height: 0px;}
.customer-table .el-table__fixed-right::before,.el-table__fixed::before {width: 0;}
其中,第一行代码是去掉表格内的线,第二行代码是去掉最下面的那一条线,第三行代码是去掉固定列的右边框和表格的左边框。这样就可以完全去除el-table的底部横线了。
相关问题
el-table去掉底部横线
如果您想要在 Element UI 的 el-table 中去掉底部边框线,可以使用以下 CSS 样式来实现:
```
.el-table__body-wrapper.is-scrolling-none .el-table__body {
border-bottom: none !important;
}
```
将上述样式添加到您的样式表中即可。需要注意的是,这样会将所有 el-table 中的底部边框线都去掉,如果您只想去掉某个 el-table 的底部边框线,可以在该 el-table 的外层容器上添加一个特定的类名,然后将上述样式修改为:
```
.your-custom-class .el-table__body-wrapper.is-scrolling-none .el-table__body {
border-bottom: none !important;
}
```
这样仅会影响拥有 `.your-custom-class` 类名的 el-table。
el-table el-table--fit el-table--enable-row-hover el-table--enable-row-transition el-table--medium如何去掉
el-table是Element UI框架中的一个表格组件,el-table--fit、el-table--enable-row-hover、el-table--enable-row-transition、el-table--medium是该组件的一些样式类。如果你想去掉这些样式类,可以通过以下方式进行操作:
1. el-table--fit:该样式类用于使表格自适应父容器的宽度。如果你想去掉这个样式类,可以在el-table标签上移除fit属性,或者在样式中将该类的宽度设置为auto。
2. el-table--enable-row-hover:该样式类用于启用鼠标悬停行高亮效果。如果你想去掉这个样式类,可以在el-table标签上移除row-hover属性。
3. el-table--enable-row-transition:该样式类用于启用行过渡效果。如果你想去掉这个样式类,可以在el-table标签上移除row-transition属性。
4. el-table--medium:该样式类用于设置表格的中等大小。如果你想去掉这个样式类,可以在el-table标签上移除size属性,或者将该类的相关样式设置为其他大小。