uniapp 设置内容超长时的省略样式

news2025/1/21 0:47:54

需求

在uniapp中,页面在展示搜索历史的时候,需要对内容过长的进行处理,也就是文本超出我的最大长度时,不允许换行,且末尾为省略

期望的效果如下

思路

使用 官网  text-overflow 可选值俩个 

  • clip  修建文本
  • ellipsis 显示省略符号来代表被修剪的文本

解决方法

代码

.center_item{
			max-width:calc(100%-60rpx);/*盒子最大宽度*/
			overflow: hidden;
			text-overflow: ellipsis; /* 设置文本溢出时显示省略号 */
			white-space: nowrap; /* 设置不换行 */
}

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

电脑版便签软件怎么设置在桌面上显示?

对于不少上班族来说,如果想要在使用电脑办公的时候,随手记录一些常用的工作资料、工作注意事项等内容,直接在电脑上使用便签软件记录是比较方便的。电脑桌面便签工具不仅方便我们随时记录各类工作事项,而且支持我们快速便捷使用这…

虚拟机网络设置

虚拟机网络设置 上一篇讲了虚拟机的安装与使用 因为虚拟机默认使用的是网络地址转换和端口转发的方式,这种方式对于后面的开发不方便,所以我们需要设置虚拟机网络。 直接修改虚拟机的网卡信息 进入虚拟机并和虚拟机建立连接,在虚拟机内修改…

分布式环境下的session 共享-基于spring-session组件和Redis实现

1、问题概述 不是所有的项目都是单机模式的,当一个项目服务的局域比较广,用户体量比较大,数据量较大的时候,我们都会将项目部署到多台服务器上,这些个服务器都是分布在不同的区域,这样实现了项目的负载和并…

Spring Boot 项目的创建、配置文件、日志

文章目录 Spring Boot 优点创建 Spring Boot 项目创建项目认识目录网页创建(了解) 约定大于配置Spring Boot 配置文件配置文件格式读取配置项properties 配置文件yml 配置文件基本语法进阶语法配置对象配置集合yml 设置不同环境的配置文件 Spring Boot 日…

使用MIB builder自定义物联网网关的MIB结构

文章目录 物联网网关初识(了解即可)IoT的通用MIB库结构MIB Builder开发流程指导问题总结子叶没所属分组值范围不为0 物联网网关初识(了解即可) 网关又称网间连接器、协议转换器。简单说,物联网网关是一台智能计算机&a…

Java集合进阶(上)

集合 集合在Java开发中应用极为广泛,它其实就是一些常用的数据结构的包装类,分为单列集合(Collecton接口类,例如LinkdeList集合)和双列集合(Map接口类,例如HashMap集合)两种 Collection Coll…

Sprite Editor图片编辑器的使用_unity基础开发教程

Sprite Editor图片编辑器的使用 什么是Sprite Editor安装插件(3D项目)切片方式Automatic:自动切片Grid By Cell Size:按照像素大小进行切片Grid By Cell Count:按照个数进行切片Isometric Grid:等距网格切片…

Java利用UDP实现简单群聊

一、创建新项目 首先新建一个新的项目,并按如下操作 二、实现代码 界面ChatFrame类 package 群聊; import javax.swing.*; import java.awt.*; import java.awt.event.*; import java.net.InetAddress; public abstract class ChatFrame extends JFrame { p…

基于OpenCV+CNN+IOT+微信小程序智能果实采摘指导系统——深度学习算法应用(含pytho、JS工程源码)+数据集+模型(一)

目录 前言总体设计系统整体结构图系统流程图 运行环境Python环境TensorFlow 环境Jupyter Notebook环境Pycharm 环境 相关其它博客工程源代码下载其它资料下载 前言 本项目基于Keras框架,引入CNN进行模型训练,采用Dropout梯度下降算法,按比例…

MAC 系统在vs code中,如何实现自动换行

目录 问题描述: 问题解决: 问题描述: 在vscode中,有些时候,一行内容过多,如果不能自动换行,就需要拖动页面,才能看到完整的内容。如下图两行所示: 问题解决&#xff1a…

华为数通---使用基本ACL限制Telnet登录权限案例

组网需求 如下图所示,PC与设备之间路由可达,用户希望简单方便的配置和管理远程设备,可以在服务器端配置Telnet用户使用AAA验证登录,并配置安全策略,保证只有符合安全策略的用户才能登录设备。 配置通过Telnet登录设备…

在Spring Cloud中使用组件Ribbon和Feign,并分别创建子模块注册到Eureka中去

ok,在上篇文章中我们讲了在Spring cloud中使用Zuul网关,这篇文章我们将Spring Cloud的五大核心组件的Ribbon和Feign分别创建一个微服务模块。 题外话,本篇博客就是配置子模块,或者说是微服务,然后将微服务正式启动之前…

2024年江苏省职业院校技能大赛信息安全管理与评估 第三阶段教师组(样卷)

2024年江苏省职业院校技能大赛信息安全管理与评估 第三阶段教师组(样卷) 竞赛项目赛题 本文件为信息安全管理与评估项目竞赛-第三阶段教师组样题, 内容包括:网络安全渗透、理论技能与职业素养。 本次比赛时间为180分钟。 介绍 Ge…

Unity中Batching优化的GPU实例化(1)

文章目录 前言一、GPU实例化的规则1、必须满足 Mesh 网格一样2、只有OpenGL es 3.0及以上才支持(3.0及以上有部分硬件可能也不支持) 二、GPU实例化的应用场景1、公开几个成员属性,用于存放可以调整的数据2、用Random.insideUnitCircle随机生成…

Linux(ubuntu)利用ffmpeg+qt设计rtsp_rtmp流媒体播放器(完全从0开始搭建环境进行开发)

一、前言 从0开始搭建Linux下Qt、ffmpeg开发环境。 从安装虚拟机开始、安装Linux(Ubuntu)系统、安装Qt开发环境、编译ffmpeg源码、配置ffmpeg环境、编写ffmpeg项目代码、完成项目开发。 完全从0开始搭建环境进行开发 完全从0开始搭建环境进行开发 完全从0开始搭建环境进行开…

决策树 (人工智能期末复习)

几个重要概念 信息熵:随机事件未按照某个属性的不同取值划分时的熵减去按照某个属性的不同取值划分时的平均 熵。即前后两次熵的差值。 表示事物的混乱程度,熵越大表示混乱程度越大,越小表示混乱程度越小。 对于随机事件,如果它的…

【Hadoop_01】Hadoop介绍与安装

1、Hadoop、HDFS、YARN介绍(1)Hadoop简介与优势(2)Hadoop组成(3)HDFS概述(4)YARN概述(5)MapReduce概述 2、安装(1)Centos7.5软硬件安装…

数据仓库与数据挖掘复习资料

一、题型与考点[第一种] 1、解释基本概念(中英互译解释简单的含义); 2、简答题(每个10分有两个一定要记住): ① 考时间序列Time series(第六章)的基本概念含义解释作用(序列模式挖掘的作用); ② 考聚类(第五章)重点考…

用23种设计模式打造一个cocos creator的游戏框架----(四)装饰器模式

1、模式标准 模式名称:装饰器模式 模式分类:结构型 模式意图:动态地给一个对象添加一些额外的职责。就增加功能来说,装饰器模式比生成子类更为灵活。 结构图: 适用于: 当需要给一个对象在运行时添加更…

Linux系统调试课:网络性能工具总结

文章目录 一、网络性能指标二、netstat三、route四、iptables沉淀、分享、成长,让自己和他人都能有所收获!😄 📢本篇章一起了解下网络性能工具。 一、网络性能指标 从网络性能指标出发,你更容易把性能工具同系统工作原理关联起来,对性能问题有宏观的认识和把握。这样,…