el-table 固定表头,固定列,动态高度,最简单的办法

本文介绍了如何在前端开发中实现表格的固定表头、固定列和动态高度。通过设置`el-table`的高度属性`height`,可以实现表格高度自适应页面。对于固定列,只需为相应列添加`fixed`属性,可指定左右固定。动态高度使用CSS的`calc()`函数结合`vh`单位,确保表格在不同屏幕尺寸下保持合适的高度。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1.固定表头

      el-table 直接设置  height 属性

2.固定列

     想要固定的列,添加fixed属性(可以设置左右固定)

3.动态高度

      height="calc(100vh - 180px )" 即可,180px 可以改变,自己自测一下

<el-table

        :data="tableData"

        height="calc(100vh - 180px )"

        style="width: 100%"

      >

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值