element-ui table 表格内出现一根横线

最新推荐文章于 2024-06-18 17:22:45 发布
最新推荐文章于 2024-06-18 17:22:45 发布
阅读量1.3k 收藏
点赞数 1
文章标签： vue.js javascript css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/w1753034677/article/details/126061413
版权
当使用Element-UI的uitable表格组件，并且配置了固定左侧列，在数据只有一行的情况下，IE11浏览器可能会出现底部多余横线的显示异常。该问题在谷歌浏览器中不存在。解决方法是在全局样式中添加`.el-table__fixed-right`样式，设置其高度为`100%!important`，确保不加在含有scope的style上。
摘要由CSDN通过智能技术生成

element-ui table 表格内出现一根横线
element-ui table表格组件 , 在使用固定左侧列的时候 , 而且只有在数据只有一行的时候 , 经常会出现 这种情况 , 底部出现一根横线 , 谷歌浏览器没问题, ie11 浏览器是这个问题 , 记录一下

解决方法 , 设置全局样式 ,
.el-table__fixed-right{
  height: 100% !important; 
 }
记住是加在全局样式上 , 不能加在含有scope的style上
不要加在这个里面, 不起作用

 

w1753034677
关注
解决elementUI固定列后，下方多了一条横线的问题
qq_37635012的博客
02-18 854
【代码】解决elementUI固定列后，下方多了一条横线的问题。
Vue及Element UI&vue-element-admin简记
生活在别处
11-21 6950
文章目录概念索引安装vue基本语法声明式渲染动态参数双向绑定数据绑定中进行数据处理使用JS表达式计算属性侦听器Class 与 Style 的数据绑定Class的数据绑定Style的数据绑定条件与循环条件渲染v-if指令v-show指令列表（数组）渲染数据更新检测事件监听器修饰符事件修饰符按键修饰符按键码系统修饰键指令的缩写组件化应用构建vue实例实例生命周期的钩子模板语法高级语法相关概念HTML ...
elementUI 表格固定某些列后，下边框和侧边框不显示（被遮盖）
zhengyun1568的博客
02-26 3724
转载自：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
解决elementUI 切换tab后 el_table 固定列下方多了一条线问题
11-20
现象： 解决方法 ： 1.修改全局css 2.只修改局部css .你的tableClass{ /deep/ .el-table__fixed { height: 100% !important; //设置高优先，以覆盖内联样式 } } 补充知识：解决ElementUI的Table组件固定列，在屏幕刚好够表格显示时，会出现固定列显示不全的问题 在使用ElementUI的Table组件中的固定列时，发现当表格刚好显示全，处于临界值状态时，固定列的高度(height)会于表格高度不一致，导致固定列显示不全，出现垂直滚动条。 如上图所示，现在表格下方是未出现水平滚动条的，处
【element-ui】解决问题——el-table组件表格上多出一条横线
weixin_42866036的博客
08-20 2474
在使用element-ui的el-table组件，添加多条数据时，表格上多出一条横线。影响表格的美观。
el-table多一条横线
最新发布
weixin_50517811的博客
06-18 283
el-table多一条横线，el-table有一个before的伪元素作为表格的下边框下，初始的时候已设置，在滚动的时候并没有重新设置位置，导致滚动的el-table带上了这条线。问题：当设置dialog中有el-table时，并设置el-table区域的滚动，看到el-table中多了一条横线。简单粗暴的可以使用display:none 或者height :0。有调整该伪元素层级的，但并不能可靠的解决。
elementui 表格出现多余横线
weixin_42674490的博客
03-24 1366
出现如下图所示的渲染问题 在全局样式表里面添加以下代码即可 .el-table::after,.el-table::before { display: none; }
解决el-table多出一条横线的问题
shiqifei的博客
06-14 823
此问题主要是伪元素导致，将伪元素隐藏，下面提供两种方式。
vue element-ui表格的滚动条样式修改
weixin_43829905的博客
12-30 7536
vue element-ui表格的滚动条样式修改 默认element-ui table固定表头或列时，当表列过多出现滚动时，滚动条效果如下，效果不是很好看（个人感觉） 修改前效果： 修改后效果： 满意度加加 直接加全局代码样式修改就可以了 /*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/ ::-webkit-scrollbar { width: 6px; /*滚动条宽度*/ height: 8px; /*滚动条高度*/ background-color: white;
解决 elementUI 切换table后 el_table 固定列下方多了一条线
weixin_55560445的博客
10-15 6043
问题： element-ui 在tab选项卡的页面点击tab切换后，表格中若存在某一列使用了fixed属性固定，会在固定列的底部出现一行横条，如下图所示： 解决方法： 1.修改全局css 2.只修改局部css .tableClass{ //table的class /deep/ .el-table__fixed { height...
element表格出现多余横线（线条）问题解决
weixin_45223696的博客
09-16 3124
app.vue加入以下样式就看不到了 body .el-table::before { z-index: inherit; }
element-ui里el-table表格操作列多横线怎么解决
2201_75705263的博客
08-26 1279
在vue中封装了element-ui表格，然后使用插槽，fixed定位等，导致样式出现了错乱。
Vue第 47 篇，表格el-table多出一条横线，怎么解决，Vue样式穿透（el-table表格下方多一条线的问题，Vue2样式穿透，Vue3样式穿透）
weixin_65793170的博客
06-21 2444
⭐最近在写表格的时候，发现的问题，表格多出一条横线，可以看出其它行，都是正常显示，只有第7行多出一条横线，找了好久，最后发现是el-table表格的伪元素，问题就出在这：​ 直接在样式里写入，样式穿透，请看
elementui表格单元格无数据显示‘-’
weixin_45428021的博客
01-18 1969
.el-table /deep/ .el-table__body td .cell:empty::after, .el-table /deep/ .el-table__body td .cell > span:empty::after, .el-table /deep/ .el-table__body td .cell .approval:empty::after, .el-table /deep/ .el-table__body td .cell div:empty::after, .el-tab.
解决 elementUI table 使用固定列下方出现的一条线
qq_45940805的博客
01-14 1116
解决 elementUI table 使用固定列下方出现的一条线 网上搜的全是什么设置100%之类的不符合自己项目要求 把那条线修改为透明即可,完美解决 .el-table__fixed-right::before{ background-color:transparent !important ; }; ...
如何解决el-table出现一条线
票票的博客
08-27 2528
解决方法 .el-table::before { z-index: inherit; }
element UI 设置 el-table 表格 表头及各行的高度斑马线样式
moyuhao的博客
06-18 3272
设置表头行高，各行行高 ，斑马线样式 <el-table :data="unitList" :header-cell-style="{ <!-- 设置表头的背景色，字体颜色，行高 --> background:'#5E95E8', color:'#FFFFFF', height:'35px', padding:'2px' }" stripe <!-- 隔行设置颜色 斑马线样式 --&g.
elementui table fixed下划线问题
WLinna的博客
06-24 1187
说明：今天使用elementui表格组件，表格中使用了fixed:right，谷歌浏览器下出现时出现了这样的现象，底部出现横线。最后一列为fixed属性时，高度会出现未占满父元素的整个高度，因此会出现一条灰线使用样式穿透，设置table的fixed_right样式 注意：使用样式穿透记得加 或者把样式加在全局样式里...
Vue+element-ui Table二次封装实践详解
Vue.js是一款轻量级的前端框架，而element-ui则是一套基于Vue的UI组件库，提供了丰富的界面元素，包括表格Table。在实际开发中，特别是数据管理系统的构建中，表格的使用非常频繁，为了提升开发效率和代码质量，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值