Element el-table-column宽度设置百分比无效

2023-11-11

问题:使用Element table组件时,给列设置百分比宽度无效(width=“30%”)
解决:用属性min-width="3"代替属性width=“30%”,且每一列都必须设置
原因:el-table 组件会被 vue 解析成 html, width 设置百分比的值直接被解析去掉百分号变成 px 了。设置成 min-width 之后,width 的值就被计算成 (当前值 / 所有列值和)的百分比了。
解释:width,min-width 原理都是将值百分比去掉变成px。但是min-width会按照比例分配剩余空间。并不是直接算的百分比。(所以要每一列都设置min-width才能实现每一列的百分比配置)
示例:

一行有 5 列:
col1: min-width=‘1’
col2: min-width=‘1’
col3: min-width=‘1’
col4: min-width=‘1’
col5: min-width='2’

col1: width占1 / 6
col2: width占1 / 6
col3: width占1 / 6
col4: width占1 / 6
col5: width占2 / 6

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Element el-table-column宽度设置百分比无效 的相关文章

  • 查找元素内没有类或 id 的元素 - jQuery

    td class box span img src http something com span td 您将如何选择 span 标签 我需要使用 jQuery 添加额外的图像 用于用户脚本 但是选择跨度然后添加元素比我想象的要困难 其中任
  • XSLT根据父子元素的值删除子元素

    我正在尝试使用这里使用的一些相同的逻辑https stackoverflow com a 10629806 662877 到不同的 XML 但没有得到预期的输出 如果 TERR KHM6 则删除 剥离这两个元素创建付款项目 and 创建支付
  • 为什么长度为 1 的元组的元组实际上不是元组,除非我添加逗号?

    给定一个元组的元组T a b 和一个单独的元组t1 a b 为什么 t1 in T 返回假 更新 来自 Ipython In 22 T a b In 23 t1 a b In 24 t1 in T Out 24 False 那么如何检查一个
  • 获取 DOM 节点的字符串表示形式

    Javascript 我有一个节点 元素或文档 的 DOM 表示 我正在寻找它的字符串表示 例如 var el document createElement p el appendChild document createTextNode
  • 如何从 NSDictionary 中选择随机键?

    当我使用 NSArray 时 这很简单 NSArray array lastIndex INT MAX int randomIndex do randomIndex RANDOM INT 0 array count 1 while rand
  • 无法使用 XPath 表达式定位 LABEL 的元素

    我正在尝试使用下面的 xpath 作为标签 但我无法找到该元素 driver findElement By xpath div label contains text Patient s Name isEnabled XPath id up
  • 获取缩放散点图中的面积或元素

    我有以下问题 我想放大散点图 然后选择所有显示的元素 以某种方式获得放大散点图中的显示区域就足够了 从该区域的范围我可以确定哪些元素显示在该区域中 哪些不显示 edit 找到解决方案 实现 AxisChangeListener 接口 imp
  • Jquery无法在回调函数中访问$(this)

    我正在创建一个插件 但它无法访问 this 我的插件的简单概述是 function fn myPlugin function options callback return this each function this click fun
  • Java Web 服务和 SOAP - 更改元素名称

    我正在编写一个返回自定义类型的 java Web 服务 一切工作正常 除了当我查看 SOAP 响应时它不使用名称 myType 它使用 return 这是我的 SOAP 响应 基本上它说 return 我希望它说 mytype S Enve
  • jquery在一行中引用多个元素

    我怎样才能把这个写成一行 id whatever id1 whatever class whatever 与 CSS 一样 您可以使用逗号将多个不同的选择器连接在一起 id id1 class whatever
  • 从数组中删除元素(Java)[重复]

    这个问题在这里已经有答案了 有没有快速 而且美观 的方法来从 Java 数组中删除元素 您可以使用 commons lang 的 ArrayUtils array ArrayUtils removeElement array element
  • style = auto 或 100% 时获取元素高度?

    正如问题所问 当元素具有 style width 100 height auto 时 如何获得该元素的确切 px 高度或宽度例如 我可能不会将它嵌套在 div 内并通过 so 获取高度 宽度 我猜 javascript 可以在这里提供帮助
  • 引用 JSON (Javascript) 对象的元素

    如何引用 JSON Javascript 对象的元素 示例 alert homes Agents 1 name
  • 如何动态更改 Angular 中元素的 id?

    我在循环中有一个元素 我只想更改它的 id 以避免冲突 我做了一些搜索 但似乎找不到任何东西 div div index div div 问题是当我调用 ngOnInit 时document getElementById index 1 它
  • 在 JavaScript 中从对象创建 DOM 元素

    嗨 我试图了解如何制作 Dom elemnt 比如说 div 形成我的数据对象 我做了一个这样的对象 var div style width Math floor Math random 100 height Math floor Math
  • 获取显示器内部元素的大小:无父级

    我正在尝试获取将在 jquery ui 对话框中显示的元素的宽度 该对话框设置为在加载时显示 无 这不允许我获得宽度 我是否需要显示它 获取宽度并立即再次隐藏它以获取宽度 或者还有其他我不知道的选择吗 Thanks 您有两个选择 如果你的
  • JQuery 选择框和循环帮助

    谢谢阅读 我对 jQuery 有点陌生 我正在尝试制作一个可以包含在我所有网站中的脚本来解决一个总是让我发疯的问题 问题 带有长选项的选择框在 Internet Explorer 中会被截断 例如 这些选择框 http discoverfi
  • Jquery Draggables:删除元素会更改其他删除元素的位置

    当放置 放置元素 通过从一个 DIV 拖动到另一个 DIV 然后删除放置的 DIV 中的一个元素时 其中一些元素会更改位置 这是一个测试场景 http jsfiddle net TcYHW 8 http jsfiddle net TcYHW
  • 对其他元素值的 XSD 限制

    是否可以在 XSD 文档中对其他元素值进行限制 例如 我有国家和州元素 如果国家 地区等于美国 那么我需要限制指定枚举的状态元素值 否则状态可以只是固定长度的字符串 当前 XSD 的示例 始终将状态限制为枚举
  • 当我尝试从列表中删除元素时,如何忽略 ValueError?

    如果我打电话 如何忽略 不在列表中 错误消息a remove x when x不在列表中a 这是我的情况 gt gt gt a range 10 gt gt gt a 0 1 2 3 4 5 6 7 8 9 gt gt gt a remov

随机推荐

  • 2021美赛D题

    2021年ICM问题D 音乐的影响 音乐自古以来就是人类社会的一部分 是文化遗产的重要组成部分 为了理解音乐在人类集体经验中所扮演的角色 我们被要求开发一种量化音乐进化的方法 当艺术家创作一首新的音乐作品时 有许多因素会影响他们 包括他们与
  • miscellany-在idea里创建properties文件

    在idea里创建properties文件 在resources里创建即可
  • C++this指针

    C this指针 this是C 中的一个关键字 也是一个const指针 它指向当前对象 通过它可以访问当前对象的所有成员 例如 class A private char name public void show cout lt lt he
  • ubuntu22.04安装YouCompleteMe

    先建一个文件夹 sudo mkdir vim bundle 然后进入这个文件夹 hunter hunter desktop vim bundle ls command t sparkup vim fugitive Vundle vim 接下
  • Qt入门超级简单小项目(3)布局管理器

    环境 Windows10 Qt5 完善菜单 1 新建Qt Widgets应用 项目名称为myMainWindow1 基类选择QMainWindow 类名为MainWindow 2 完成后 在设计模式添加菜单项 并添加资源文件 向其中添加菜单
  • sharding-jdbc 实现按月分表

    最近生产上发现了一个大表 因为数据太多导致新增查询都很慢 考虑先对历史数据进行归档 新数据按月分表存储 使用到的框架主要是 sharding jdbc spring boot mybatis durid 先建个demo简单实践下 首先 准备
  • wsl Hyper-V 与 安卓模拟器虚拟机同时共存方案

    最新消息 雷电9 0版本 已经支持共存了 不必搞那么麻烦了 WSL 在开发者手里是必不可少的 仿真服务器开发模式 安卓虚拟机 有时调试起来更加方便 但可惜的是 市面上的安装模拟器 都不支持与wsl友好共存 要么是版本低 要么是卡到要死 既然
  • 日志定期压缩、清除

    1 背景 定位问题 打印日志的一个目的是为了快速定位线上问题 日志打印的越详细 问题原因就越容易定位 磁盘空间有限 随着业务量提升 磁盘空间满了 日志将无法打印了 为了平衡上面两个条件 我们可以压缩文件和保留一定时间 如7天 的历史文件 2
  • SFM(Structure from Motion)一点总结

    SFM Structure from Motion 一点总结 运动结构恢复 Structure from motion 数十年来一直是计算机视觉领域的热门研究方向之一 实现了众多实际应用 尤其在近景三维重建中 该算法从获取的目标物系列影像出
  • 最全FreeSwitch 1.10.9 Linux通用编译部署教程

    FreeSwitch 通用编译部署教程 文章目录 FreeSwitch 通用编译部署教程 FreeSwitch的版本历程 1 基础环境 2 安装方式 3 安装基础依赖 4 下载cmake并进行编译安装 5 需要手动安装所需的依赖 6 下载源
  • IT数字化能力和运营效果成熟度模型 附下载

    栗蔚表示 企业的数字化是转型和赋能交替发展的旅程 或因其在数字化进程中对数字化技术的应用程度不同 处于不同阶段并扮演不同的角色 农牧业企业 制造企业 交通企业等传统行业企业目前正处于通过深化运用数字化技术开展自我转型的阶段 转型者属性明显
  • 全网最详细金融APP测试功能点-测试用例,详细整理(全)

    目录 导读 一 前言 二 业务测试 三 功能测试 1 交互逻辑检查 2 页面之间的数据读取 3 一般性检查 四 安全性测试 1 敏感数据本地可破解 2 网络传输 3 Android组件权限保护 4 升级 5 应用自身安全性 6 请求传输 五
  • springboot ajax 跨域,SpringBoot解决ajax跨域问题

    import org springframework context annotation Configuration import org springframework web servlet config annotation Cor
  • Mac电脑实用软件汇总

    软件用途 软件名称 简介 下载链接 截图 Snipaste Snipaste
  • 在服务器Linux系统中搭建JavaWeb环境

    目录 软件安装 安装JDK 安装Tomcat 本文使用的服务器是阿里云的云服务器ECS 软件安装 安装JDK 通过SSH软件把jdk安装包 任意版本皆可 传至指定位置 这里选择 home soft 将压缩包解压至 usr java 需提前创
  • qt使用自定义属性方法让子控件动态改变qss样式

    用动态改变QLabel样式为例 分为QLabel选择状态和未选择状态 1 自定义类继承自QLabel 用Q PROPERTY宏注册一个名称为select属性 2 QSS文件中预先设置QLabel属性 QLabel label2 select
  • 腾讯云coding平台平台inda目录遍历漏洞复现

    前言 其实就是一个python的库可以遍历到 并不能遍历到别的路径下 后续可利用性不大 并且目前这个平台私有部署量不多 大多都是用腾讯云在线部署的 CODING DevOps 是面向软件研发团队的一站式研发协作管理平台 提供从需求到设计 开
  • springmvc控制器的三种实现方式

    方式一 实现Controller接口 public class Test01 implements Controller Override public ModelAndView handleRequest HttpServletReque
  • vue实现element-ui自定义主题色切换(简单版)

    需求 通过点击图标实现了白天和黑夜的页面效果的实现 可以自定义颜色 手写 比较简单 如果需要复杂功能 根据颜色选择器实现element ui全部的主题色切换可以看我另一篇 还在写 效果 1 定义个图标用于切换主题 div div
  • Element el-table-column宽度设置百分比无效

    问题 使用Element table组件时 给列设置百分比宽度无效 width 30 解决 用属性min width 3 代替属性width 30 且每一列都必须设置 原因 el table 组件会被 vue 解析成 html width