elementui问题记录-el-table组件的列属性show-overflow-tooltip内容过多时,如何设置tooltip的宽度_eleplus的table组件tooltip怎么改变tooltip的宽度-程序员宅基地

技术标签: elementui问题记录  el-tabel  elementui  前端  

  • 案发现场:
    使用elementui el-table的:show-overflow-tooltip="true"属性时,当单元格数据过多时,鼠标划过时显示全部数据,此时数据会显示在一行中,不太美观,需要修改其宽度。
    在这里插入图片描述
  • 解决方案:
    未生效的解决办法:第一次修改,在<style lang="scss" scoped>中添加如下样式,但是没有生效,添加/deep/也没有生效。
    <style lang="scss" scoped>
    // @import "../assets/css/base.css";
    /deep/ .el-tooltip__popper {
          
      max-width: 300px;
    }
    
    终极解决办法:该样式需要加在全局样式中。不能在<style scoped></style>中修改,因为不会生效。
    添加base.css,然后引用(Vue项目)
    <style lang="scss" scoped>
    @import "../assets/css/base.css";
    
    在这里插入图片描述
  • 实现效果:
    在这里插入图片描述
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/qq_38332722/article/details/107782018

智能推荐

Acwing第72场周赛+Leetcode第314场周赛_acwing 第72场周赛4625. 压缩文件-程序员宅基地

文章浏览阅读309次。Acwing第72场周赛+Leetcode第314场周赛_acwing 第72场周赛4625. 压缩文件

计算机就业方向-程序员宅基地

文章浏览阅读6.8k次,点赞5次,收藏12次。希望看到这篇文章的学计算机、软件的同学可以互相转载,让大家都知道我们以后的道路是怎样的。有了方向,干什么都有动力,不是吗?(有点长,希望大家先分享,以后慢慢看,有用没用,我说了不算,你看看就知道了!)计算机专业就业方向一、 关于企业计算方向企业计算(Enterprise Computing)是稍时髦较好听的名词,主要是 指企业信息系统,如ERP软件(企业资源规划)、CRM软件(客户关系_计算机就业

基于Java在线电影票购买系统设计实现(源码+lw+部署文档+讲解等)-程序员宅基地

文章浏览阅读4.1k次,点赞2次,收藏4次。社会和科技的不断进步带来更便利的生活,计算机技术也越来越平民化。二十一世纪是数据时代,各种信息经过统计分析都可以得到想要的结果,所以也可以更好的为人们工作、生活服务。电影是生活娱乐的一部分,特别对喜欢看电影的用户来说是非常重要的事情。把计算机技术和影院售票相结合可以更符合现代、用户的要求,实现更为方便的购买电影票的方式。本基于Java Web的在线电影票购买系统采用Java语言和Vue技术,框架采用SSM,搭配MySQL数据库,运行在Idea里。

集合的addAll方法--list.addAll(null)会报错--java.lang.NullPointerException-程序员宅基地

文章浏览阅读1.8k次。Exception in thread "main" java.lang.NullPointerException at java.util.ArrayList.addAll(ArrayList.java:559) at com.iflytek.epdcloud.recruit.utils.quartz.Acool.main(Acool.java:16)import java.u..._addall(null)

java获取当天0点到24点的时间戳,获得当前分钟开始结束时间戳_java 获取某分钟的起止时间戳-程序员宅基地

文章浏览阅读4.5k次。public static void main(String[] args) { Calendar todayStart = Calendar.getInstance(); todayStart.set(Calendar.HOUR_OF_DAY, 0); todayStart.set(Calendar.MINUTE, 0); toda..._java 获取某分钟的起止时间戳

北京内推 | 京东AI研究院计算机视觉实验室招聘三维视觉算法研究型实习生-程序员宅基地

文章浏览阅读1.1k次。合适的工作难找?最新的招聘信息也不知道?AI 求职为大家精选人工智能领域最新鲜的招聘信息,助你先人一步投递,快人一步入职!京东 AI 研究院京东 AI 研究院(https://air.jd..._京东计算机视觉实验室

随便推点

Vue.js npm错误:transpileDependencies.map不是一个函数_transpiledependencies.map is not a function-程序员宅基地

文章浏览阅读483次。这个错误通常是由于npm版本不兼容导致的。在旧版本的npm中,transpileDependencies是一个字符串数组,我们可以直接配置需要编译的依赖库。而在较新版本的npm中,transpileDependencies被改成了一个对象,并且需要使用map()方法来处理。因此,如果我们在较新版本的npm中使用了旧版本的配置方式,就会导致transpileDependencies.map不是一个函数的错误。_transpiledependencies.map is not a function

关于EXT JS 的所有组件_ext.js 组件-程序员宅基地

文章浏览阅读2.3k次。EXTJS的组件体系中有进40种组件,而这些组件又可以大致分成三大类,即基本组件、工具栏组件、表单及元素组件。 基本组件是构成Web UI的主体组件,因为这些组件在其他开发体系中也都有部分存在。这些组件丰富了传统Web UI 的表现,是EXTJS改善Web UI 的重要体现。 EXIJS的基本组件:xtype Class _ext.js 组件

探索 Toolbox-Weex:一款强大的 Weex 工具集合-程序员宅基地

文章浏览阅读241次,点赞3次,收藏6次。探索 Toolbox-Weex:一款强大的 Weex 工具集合项目地址:https://gitcode.com/hugojing/toolbox-weexToolbox-Weex 是一个开源项目,专门为 Weex 开发者提供了一整套便捷的工具和组件,旨在提升 Weex 应用开发的效率和质量。如果你是 Weex 的爱好者或正在寻找优化你的移动应用开发流程的方法,那么 Toolbox-Weex 绝..._wsatoolbox

卷积神经网络模型可视化生成热力图_卷积热力图-程序员宅基地

文章浏览阅读2.3k次。使用Grad-CAM++[51]方法对训练好的卷积神经网络模型进行可视化操作生成热力图以查看响应区域。可视化结果如图3.8所示。其中baseline和 ATN可视化需要的权重来自于分类结果对最后一层卷积层提取的特征进行求导。图3.8中共有4组图像,每组图像从左往右依次为原图,根据baseline权重生成的热力图和根据本章提出的ATN网络权重生成的热力图。热力图的红色越深,则表示该部分的权重越高。从生成的热力图可以看到,baseline 生成的热力图中,虽然在人体区域都有响应,但是背景噪声部分的响应权重也_卷积热力图

网络安全实验---防火墙实验-程序员宅基地

文章浏览阅读2w次,点赞13次,收藏82次。文章目录一、实验目的:二、实验环境:三、实验内容:1. 安装天网防火墙2. 使用天网防火墙进行实验3.在上端的菜单栏最左边点击应用程序规则,点击下方需要修改应用的选项可以对其进行流量控制4.调节ip规则配置,将“允许自己ping探测其他机器”改为禁止,查看能否再次收到reply5.添加一条禁止邻居同学主机的FTP连接规则四、心得体会:五.软件共享一、实验目的:通过实验深入理解防火墙的功能和工作原理熟悉天网防火墙个人版的配置和使用二、实验环境:一台xp虚拟机和一台windows10虚拟机在xp上安_防火墙实验

vue项目运行报错:94% asset optimization ERROR Failed to compile with 2 errors13:03:01 error in ./src/ba-程序员宅基地

文章浏览阅读6.7k次。使用vue编写的前端项目运行报错:88% hashing 89% module assets processing 90% chunk assets processing 94% asset optimization ERROR Failed to compile with 2 errors13:03:01 error in ./src/base/components/head..._94% asset optimization

推荐文章

热门文章

相关标签