el-table固定列后表头下边框会消失

最新推荐文章于 2024-01-18 08:54:00 发布
最新推荐文章于 2024-01-18 08:54:00 发布
阅读量646 收藏
点赞数 1
文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xin5zhang8/article/details/131291083
版权
在使用el-table组件时遇到一个问题，当设置列固定后，表头的下边框不见了。解决方法是通过调整CSS样式，增加`.el-table__fixed-header-wrapper`的选择器，设置`top:-2px;`和`z-index:4;`，这样可以确保边框显示正常。
摘要由CSDN通过智能技术生成

问题

el-table固定列后表头的下边框不见了

 

解决

.el-table__fixed-header-wrapper{
    top: -2px;
    z-index: 4;
}

 

xin5zhang8
关注
el-table 多级表头导出（适用于表头固定，表格有固定列）
weixin_42987973的博客
08-22 1066
el-table 多级表头固定，内容固定，导出excel模板设置内容居中，列宽
elementui 更改 el-table 表头样式及修改el-table表格边框的注意事项
前端职场小白_炜晨科技的博客
09-19 4882
element ui官方封装好的 el-table 组件， 好用是挺好用的，但不可避免的是默认的样式并不一定能满足实际开发过程中的需要，那就自己动用五姑娘吧。一是参考官方文档里面 el-table 的。
el-table表格最下面的边框线删除
热门推荐
csdn_zhuang的博客
12-16 1万+
. el-table__row>td { border: none; } .el-table::before { height: 0px; }
el-table固定列偶发拖拽出现边框消失的问题，固定列底部无法点击滑动的问题
最新发布
weixin_44295184的博客
01-18 675
el-table固定列偶发拖拽出现边框消失的问题
el-table最后一列固定,导致和前一列直接的边框线消失
C422805的博客
08-15 1486
表格最后一列右侧固定(fixed:"right"),倒数第二列右侧边框线消失了,原因固定列遮住了该列的边框。
el-table fixed以后，border消失
weixin_42925674的博客
11-23 464
背景：查了很多博客，都没有靠谱的解决方案，最后审查元素发现问题。
el-table设置边框后底部边框无法展示的解决方法
123
09-03 4199
在使用Element-UI的el-table组件时，使用cell-style给表格增加边框后，最底部的一条横线无法显示，这时候不要怀疑是自己的css写的不对，原因在于el-table的样式文件中给.el-table这个class设置了position:relative，导致无法正确显示。只需要把样式文件中的这个属性删除掉即可，暂时没发现有什么影响。 ...
element table下边线消失，以及左右边框不对齐
Aybuai的博客
07-14 1820
今天用element做表格的时候，碰见两个样式问题。问题如下图： 问题： 1、表格的下边线莫名其妙的消失了，之前也有做过，并未出现类似情况。 2、表格左右边框不对齐 解决： 问题一： <style> // 表头的下边线添加 .el-table th.is-leaf, .el-table td { border-bottom: 1px solid #EBEEF5; } // 表内容的下边线添加 .el-table td, .el-table th.is-leaf {
el table 固定表头和首行_再谈table组件：固定表头和表列
weixin_36125445的博客
02-15 2818
前言Github原文：github.com/qiud...本文介绍内容包括：1. Element UI 实现表头表列固定思考与总结2. translate3d如何实现表头表列固定书承上文，在前文【Vue进阶】青铜选手，如何自研一套UI库中介绍了Vue组件库的开发细节，举例实现了button、table等组件的开发。在Ange这个UI库中，我实现了一个内容高可定制的表格组件：可固定表头和表列，内容则...
vue修改Element的el-table样式的4种方法
10-14
在Vue.js中，Element UI库提供了丰富的组件，其中包括el-table，用于创建数据表格。然而，有时我们可能需要根据项目需求自定义el-table的样式。本文将详细介绍四种在Vue中修改Element UI el-table样式的有效方法。 ...
解决element-ui的表格设置固定栏后，右侧边框线消失
qq_36762151的博客
11-18 3186
表格最后一列右侧固定，倒数第二列右边框消失了。原因固定列遮住了该边框。
elementUI 表格固定某些列后，下边框和侧边框不显示（被遮盖）
zhengyun1568的博客
02-26 3737
转载自：https://my.oschina.net/u/3680343/blog/3144548https://www.cnblogs.com/shuen/p/10196545.html 给table设置样式，解决底部边框被遮盖 .el-table__fixed { height: 100% !important; //设置高优先，以覆盖内联样式 } .el-table__fixed-right { height: 100% !important; //设置高优先，以覆盖内联样式 } 添加css
记录错误3——elementUI之table字段设置fixed后下边框不显示错误
You_got_this的博客
11-17 1270
错误如图所示。在姓名字段设置fixed后下边框奇迹般消失，F12检查代码发现带fixed的表格行内样式中设置了固定高，在代码里使用样式穿透将高度设置为百分百边框就出现了
vxe-table 使用固定列并清除表格自带左右间距，表头边框线丢失
花椒和蕊的博客
09-19 1970
第一和第二列使用了fix属性固定列，因为是可编辑表格，使用插槽放了输入框后，要调整样式，要让输入框占满单元格。就会遇到一个问题，表格自带的vxe-cell类名，有个左右间距各10px。如果不清除的话，表格就会变成这样，两边的间距导致我们自己设的背景色占不满。如果直接deep深度改样式，就会遇到一开始的问题，表头少了下边框线。原先是这么写的，这样写的问题就是整个表格都被清除了左右间距。审查元素后，确实是这样vxe-table的左右间距导致的。换成下面这样，问题就解决了，只有表身清除。
解决element-ui的表格设置固定栏后，边框线消失的bug
weixin_44590591的博客
09-15 1362
解决element-ui的表格设置固定栏后，边框线消失的bug // 解决element-ui的表格设置固定栏后，边框线消失的bug /deep/ .el-table__row { td:not(.is-hidden):last-child { right: -1px; } } /deep/.el-table.theme table thead tr th { background: #3399ff !important; border-right:
element-ui中el-table使用fixed=“right“时固定列左边框消失问题
xiaobaige6084的博客
07-11 1522
element-ui中el-table使用fixed="right"时，横向滚动条滚到最右，固定列左边框不显示，加上如下css样式即可解决。
html 表格右侧边线消失,怎么解决table使用了border-collapse：collapse属性后，table周围边框消失的问题？...
weixin_27268733的博客
06-02 1740
我在写一个table,给table的td加上边框后，发现中间边框特别粗，所以就使用border-collapse：collapse解决。但是使用之后发现表格周围的边框不见了，请问这样改怎么解决？css部分的代码如下#tableWrap{width: 488px;height: 300px;margin: 0 auto;}#tableWrap table{width: 100%;height: 10...
vue缩放页面el-table底部展示不全
qq_43199783的博客
09-21 581
elementui table页面缩放底部展示不全
vue + element UI Table 表格 利用插槽是 最后一行 操作 的边框线 不显示
estrusKing的博客
08-02 828
在屏幕比例100%时 el-table添加border属性 使用作用域插槽 会不显示某侧的边框线，屏幕比例缩小或放大都展示。
el-table固定表头和首行
06-02
2. 通过设置 el-table 的 border 属性为 true，可以显示表格的边框，使得表头和首行固定时更加美观。 3. 通过设置 el-table 的 style 属性，可以设置表格的宽度。 通过上述设置，可以同时固定表头和首行。注意，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值