element-ui设置高度height属性与style属性设置的区别

news/2024/7/9 23:41:58 标签: ui, html, css, vue, elementui

element-html" title=ui>ui表格中,可以通过style属性和height属性来设置表格的高度。这两种方式的区别如下:

style属性设置表格高度

使用style属性可以设置表格容器的样式,包括高度、宽度、边框等。例如:

html"><el-table :data="tableData" style="css language-css">height: 300px;">
  <!-- 表格内容 -->
</el-table>

这里将表格容器的高度设置为300px,表格的高度是固定的,如果表格内容高度超过了300px,不会出现滚动条,因为默认的overflowvisible ,容不会被修剪,会呈现在元素框之外,所以要加上overflow:auto才会出现滚动条,而且表头会跟着一起滚动。

<el-table :data="tableData" style="height: 300px;overflow: auto;">
  <!-- 表格内容 -->
</el-table>

height属性element文档说明

height: Table 的高度,默认为自动高度。如果 height 为 number 类型,单位 px;如果 height 为 string 类型,则这个高度会设置为 Table 的 style.height 的值,Table 的高度会受控于外部样式。

使用height属性可以直接设置表格的高度,例如:

复制<el-table :data="tableData" height="300">
  <!-- 表格内容 -->
</el-table>

这里将表格的高度设置为300px,表格的高度是固定的,不会根据表格内容的高度自动调整。当表格的内容超过了表格的高度时会出现滚动条,表头是固定的不会一起滚动。使用height属性设置表格高度的优点是,可以精确控制表格的高度,避免表格高度不够或者过高的问题。


http://www.niftyadmin.cn/n/300720.html

相关文章

Meta内容总监:Quest最初并非侧重游戏,VR用户画像每年都在变

2019年&#xff0c;随着Oculus Quest的发布&#xff0c;Quest应用商店应运而生。仅仅4年时间&#xff0c;就成为了发展速度最快的VR平台&#xff0c;吸引越来越多的开发者进入到Quest中去&#xff0c;并关注到VR生态。截至去年10月&#xff0c;Quest商店交易规模达15亿美元&…

如何远程访问本地jupyter notebook服务器,实现无公网IP端口映射

文章目录 前言视频教程1. Python环境安装2. Jupyter 安装3. 启动Jupyter Notebook4. 远程访问4.1 安装配置cpolar内网穿透4.2 创建隧道映射本地端口 5. 固定公网地址 转载自远控源码文章&#xff1a;公网远程访问jupyter notebook【cpolar内网穿透】 前言 Jupyter Notebook&am…

一个月内面了30家公司,薪资从18K变成28K,真行啊····

工作3年&#xff0c;换了好几份工作&#xff08;行业流行性大&#xff09;&#xff0c;每次工作都是裸辞。朋友都觉得不可思议。因为我一直对自己很有信心&#xff0c;而且特别不喜欢请假面试&#xff0c;对自己负责也对公司负责。 但是这次没想到市场环境非常不好&#xff0c;…

记录一个特殊场景下,修改代码,idea 需要 mvn clean install的问题

修改java代码&#xff0c;mvn clean install 才能生效的场景&#xff0c;在网上看到一些方法&#xff0c;但是都没有生效。eg: 删除.idea&#xff0c; 删除后重新导入。每次修改代码测试的时候都要手动 clean install才可以&#xff0c;比较麻烦。 跑代码的时候&#xff0c;自…

顶级白帽黑客必备的十大黑客技术

1.熟悉Linux系统和命令行操作&#xff1a; Linux是黑客的基石&#xff0c;几乎所有黑客工具和技术都是在Linux平台上运行的&#xff0c;熟悉Linux系统和命令行操作是必须的。 2.掌握网络协议和TCP/IP模型&#xff1a; 了解TCP/IP模型、网络协议和通信流程是黑客攻击的基础&a…

BI财务智能分析,让企业管理更上一层楼

智能财务建设既可以看作是财务管理工作在经济社会数字化转型的全面开启&#xff0c;也可以看作是财务职能在以数字化技术为支撑&#xff0c;形成对内提升单位管理水平和风险管控能力、对外服务财政管理和宏观经济治理的会计职能拓展&#xff0c;究其本质则是在财务数字化转型升…

27岁转行学云计算值得吗?能就业不?

27岁转行学云计算值得吗&#xff1f;能就业不&#xff1f; 首先&#xff0c;云计算当然值得转行了&#xff0c;如此肯定的观点&#xff0c;应该没有人会反对吧&#xff0c;尤其是对IT行业的现状以及就业市场有所了解的人。如果你对这一点有所怀疑也很正常&#xff0c;只要通过各…

Information-Theoretic Segmentation by Inpainting Error Maximization总结笔记

一、《Inpainting Error Maximization》提出的提问和解决方法 《Inpainting Error Maximization》提出的提问&#xff1a;神经网络通常需要大量的手动标记的训练数据来达到最先进的性能。对于标记数据稀缺或昂贵的问题的适用性往往取决于从 相关领域迁移学习到的表示的能力。 …