el-select多选以tag展示时,超过显示长度以...省略号显示,且在一行展示

效果:

代码:

<span>系统词典维度:</span><el-selectv-model="dNum"placeholder="请选择"multiplecollapse-tags //设置collapse-tags属性将它们合并为一段文字size="small"style="width:160px"class="tags-select-input"><el-optionv-for="item in gainianOptions":key="item.uid":label="item.name":value="item.en"></el-option></el-select>

css:

.tags-select-input /deep/ .el-select__tags {white-space: nowrap;overflow: hidden;flex-flow: nowrap;display:flex;flex-wrap:nowrap;
}
.tags-select-input /deep/ .el-select__tags-text {display: inline-block;max-width: 90px;//设置最大宽度 超出显示...white-space: nowrap;overflow: hidden;flex-flow: nowrap;vertical-align:bottom;text-overflow:ellipsis;
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/165275.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Netty入门指南之NIO Buffer详解

作者简介&#xff1a;☕️大家好&#xff0c;我是Aomsir&#xff0c;一个爱折腾的开发者&#xff01; 个人主页&#xff1a;Aomsir_Spring5应用专栏,Netty应用专栏,RPC应用专栏-CSDN博客 当前专栏&#xff1a;Netty应用专栏_Aomsir的博客-CSDN博客 文章目录 参考文献前言ByteBu…

MySQL库的库操作指南

1.创建数据库 一般格式&#xff1a;create database (if not exists) database1_name,database2_name...... 特殊形式&#xff1a; create database charset harset_name collate collate_name 解释&#xff1a; 红色字是用户自己设置的名称charset&#xff1a;指定数据…

Jupyter Notebook 内核似乎挂掉了,它很快将自动重启

报错原因&#xff1a; OMP: Error #15: Initializing libiomp5md.dll, but found libiomp5md.dll already initialized. OMP: Hint This means that multiple copies of the OpenMP runtime have been linked into the program. That is dangerous, since it can degrade perfo…

STM32两轮平衡小车原理详解(开源)

一、引言 关于STM32两轮平衡车的设计&#xff0c;我想在读者阅读本文之前应该已经有所了解&#xff0c;所以本文的重点是代码的分享和分析。至于具体的原理&#xff0c;我觉得读者不必阅读长篇大论的文章&#xff0c;只需按照本文分享的代码自己亲手制作一辆平衡车&#xff0c…

OSPF下的MGRE实验

一、实验要求 1、R1-R3-R4构建全连的MGRE环境 2、R1-R5-R6建立hub-spoke的MGRE环境&#xff0c;其中R1为中心 3、R1-R3...R6均存在环回网段模拟用户私网&#xff0c;使用OSPF使全网可达 4、其中R2为ISP路由器&#xff0c;仅配置IP地址 二、实验拓扑图 三、实验配置 1、给各路…

OAuth2.0双令牌

OAuth 2.0是一种基于令牌的身份验证和授权协议&#xff0c;它允许用户授权第三方应用程序访问他们的资源&#xff0c;而不必共享他们的凭据。 在OAuth 2.0中&#xff0c;通常会使用两种类型的令牌&#xff1a;访问令牌和刷新令牌。访问令牌是用于访问资源的令牌&#xff0c;可…

SpringBoot定时任务打成jar 引入到新的项目中后并自动执行

一、springBoot开发定时任务 ①&#xff1a;连接数据库实现新增功能 1. 引入依赖 <dependency><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId><optional>true</optional> </dependency> <dependen…

c语言贪吃蛇项目的实现

ncurse的引入 ncurse的概念 ncurse(new curses)是一套编程库&#xff0c;它提供了一系列的函数&#xff0c;以便使用者调用它们去生成基于文本的用户界面。 ncurses是一个能提供功能键定义(快捷键),屏幕绘制以及基于文本终端的图形互动功能的动态库。ncurses用得最多的地方是…

计网----累积应答,TCP的流量控制--滑动窗口,粘包问题,心跳机制,Nagle算法,拥塞控制,TCP协议总结,UDP和TCP对比,中介者模式

计网----累积应答&#xff0c;TCP的流量控制–滑动窗口&#xff0c;粘包问题&#xff0c;心跳机制&#xff0c;Nagle算法&#xff0c;拥塞控制&#xff0c;TCP协议总结&#xff0c;UDP和TCP对比&#xff0c;中介者模式 一.累积应答 1.什么是累计应答 每次发一些包&#xff0…

print(torch.cuda.is_available()) False如何解决?GTX3090

首先介绍环境&#xff1a; 保证Cuda与Pytorch的版本对齐就可以了。 nvcc -V 查看原来装的是cuda11.3版本 去Pytorch官网找到相应指令下载即可&#xff1a; CtrlF&#xff1a;cuda11.3 就在诸多版本中找到啦,一定找 torch的版本cuda版本。我之前错误安装的torch&#xff0c;只…

【ES专题】ElasticSearch功能详解与原理剖析

目录 前言要点阅读对象阅读导航前置知识笔记正文一、ES数据预处理1.1 Ingest Node&#xff1a;摄入节点1.2 Ingest Pipeline&#xff1a;摄入管道1.3 Processor&#xff1a;预处理器——简单加工1.4 Painless Script&#xff1a;脚本——复杂加工1.5 简单实用案例 二、文档/数据…

Kyligence Copilot 亮相第六届进博会,增添数智新活力

11月5日&#xff0c;第六届中国国际进口博览会&#xff08;以下简称“进博会”&#xff09;在上海国家会展中心盛大启幕&#xff0c;众多新科技、新成果、新展品亮相本届进博会。作为阿斯利康&#xff08;AstraZeneca&#xff09;合作伙伴&#xff0c;跬智信息&#xff08;Kyli…