el

2024-07-11 08:25| 来源: 网络整理| 查看: 265

如下图所示,如果加了fixed之后,element会把table复制两份(如果只加一侧fixed,则只会复制一份),我们在页面上看到的结果是三个表格最终合并之后的样式在这里插入图片描述可以看到,左中右这三个表格是独立存在的,如果只双击中间的内容,左右的内容并不会被同时选中

解决办法给中间的表格设置z-index:100(100是我随便写的,只要他的层级比两边高就可以)隐藏两边的表格给展开的内容设置宽度和背景色默认宽度是表格的宽度，表格是非常宽的，如果不设置宽度，那么展开内容需要滑动才会展示完全背景色盖住fixed产生的阴影 /deep/ .el-table__body-wrapper { .el-table__expanded-cell { z-index: 100; padding: 0; } } /deep/ .el-table__fixed, /deep/.el-table__fixed-right { .el-table__expanded-cell { visibility: hidden; padding: 0; } } .expand { width: calc(100vw - 100px); padding: 20px; background: #fff;//盖住fixed产生的阴影 }

如果不设置展开内容的宽度，会默认显示表格宽度，点击展开并不能完全展示内容，需要滑动才可以展示完全在这里插入图片描述设置展开内容的背景盖住fixed产生的阴影

html代码展示

最后

本人分享一下这次字节跳动、美团、头条等大厂的面试真题涉及到的知识点，以及我个人的学习方法、学习路线等，当然也整理了一些学习文档资料出来是给大家的。知识点涉及比较全面，包括但不限于前端基础，HTML，CSS，JavaScript，Vue，ES6，HTTP，浏览器，算法等等

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

前端视频资料： [外链图片转存中…(img-y9ASyuSA-1714282494408)]

前端视频资料：

【本文地址】

el

el

今日新闻

推荐新闻