当前位置: 首页 > news >正文

css 如何让元素内部文本和外部文本 一块显示省略号

在这里插入图片描述
实际上还是有这样的需求的

<div class="container"><span>啊啊啊啊啊啊啊啊</span>你好啊撒撒啊撒撒撒撒啊撒撒撒撒撒说</div>

还是有这样的需求的哦。

div.container {width: 200px;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;display: inline-block;}div > span {display: inline-block;max-width: 100px;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;vertical-align: middle;}

vertical-align: middle; 核心的玩意就是这个。要使行内块元素文本 和后面的文本内容底部对齐。就可以了饿

关注我持续更新前端知识。

相关文章:

css 如何让元素内部文本和外部文本 一块显示省略号

实际上还是有这样的需求的 <div class"container"><span>啊啊啊啊啊啊啊啊</span>你好啊撒撒啊撒撒撒撒啊撒撒撒撒撒说</div>还是有这样的需求的哦。 div.container {width: 200px;white-space: nowrap;text-overflow: ellipsis;overflow:…...

SQL语句-中级

一、Mysql软件使用 1.启动/停止Mysql服务器 任务管理器 cmd命令&#xff1a;以管理员的身份打开cmd命令行 net start mysql80//开启net stop mysql80//停止 2.连接与断开Mysql服务器 注意要在bin目录下执行:-u用户名root&#xff0c;-p密码 mysql -u root -p 可能出现的…...

巧用h2-database.jar连接数据库

文章目录 一 、概述二、实践三、解决办法 一 、概述 H2 Database是一个开源的嵌入式数据库引擎&#xff0c;采用java语言编写&#xff0c;不受平台的限制&#xff0c;同时H2 Database提供了一个十分方便的web控制台用于操作和管理数据库内容。H2 Database还提供兼容模式&#…...

136.只出现一次的数字

136. 只出现一次的数字 - 力扣&#xff08;LeetCode&#xff09; 给你一个 非空 整数数组 nums &#xff0c;除了某个元素只出现一次以外&#xff0c;其余每个元素均出现两次。找出那个只出现了一次的元素。 你必须设计并实现线性时间复杂度的算法来解决此问题&#xff0c;且…...

mysql中遇到查询字段的别名与函数冲突问题

比如以下哎&#xff0c;我查询城市行业数量排名 select City, DENSE_RANK() over(ORDER BY COUNT(Id) DESC) rank, COUNT(Id) num,IndustrySubGroupName from base_companyinfo WHERE IndustrySubGroupName工业机器人 GROUP BY City 上面使用 DENSE_RANK() 函数来计算排名&am…...

直播获奖

题目描述 NOI2130 即将举行。为了增加观赏性&#xff0c; CCF 决定逐一评出每个选手的成 绩&#xff0c;并直播即时的获奖分数线。本次竞赛的获奖率为 &#x1d464;% &#xff0c;即当前排名前 &#x1d464;% 的选手的最低成绩就是即时的分数线。 更具体地&#xff0c…...

选择适合自身业务的HTTP代理有哪些因素决定?

相信对很多爬虫工作者和数据采集的企业来说&#xff0c;如何选购适合自己业务的HTTP代理是一个特别特别困扰的选题&#xff0c;市面上那么多HTTP代理厂商&#xff0c;好像这家有这些缺点&#xff0c;转头又看到另外一家的缺点&#xff0c;要找一家心仪的仿佛大海捞针。今天我们…...

1.3 do...while实现1+...100 for实现1+...100

思路&#xff1a;两个变量&#xff0c;一个变量存储数据之和&#xff0c;一个变量实现自增就行 do...while int i, s;i 1;s 0;do{s 1;i;} while (i < 100);cout << s << endl; for int i, j0;for (i 1; i < 100; i){j 1;}cout << j << …...

react数据管理之setState与Props

react数据管理之setState与Props setState调用原理 setState 是 React 中用于更新组件状态&#xff08;state&#xff09;的方法。它的调用原理可以分为以下几个步骤&#xff1a; 状态的改变&#xff1a;当调用 setState 时&#xff0c;React 会将新的状态对象与当前状态对象…...

如何保护我们的网络安全

保护网络安全是至关重要的&#xff0c;尤其是在今天的数字化时代。以下是一些保护网络安全的基本步骤&#xff1a; 1、使用强密码&#xff1a;使用包含字母、数字和特殊字符的复杂密码。不要在多个网站上重复使用相同的密码。定期更改密码。 2、启用双因素认证 (2FA)&#xff…...

springboot 制造装备物联及生产管理ERP系统

springboot 制造装备物联及生产管理ERP系统 liu1113625581...

Google zxing 生成带logo的二维码图片

环境准备 开发环境 JDK 1.8SpringBoot2.2.1Maven 3.2 开发工具 IntelliJ IDEAsmartGitNavicat15 添加maven配置 <dependency><groupId>com.google.zxing</groupId><artifactId>core</artifactId><version>3.4.0</version> </…...

使用Python计算平面多边形间最短距离

要计算平面多边形间的最短距离&#xff0c;首先需要导入Excel表格中的多边形数据&#xff0c;然后使用GJK&#xff08;Gilbert-Johnson-Keerthi&#xff09;算法来判断两个多边形是否重叠。如果两个多边形不重叠&#xff0c;可以计算它们之间的最短距离。 以下是一个基本的Pyt…...

【Python】Python语言基础(中)

第十章 Python的数据类型 基本数据类型 数字 整数 整数就是整数 浮点数 在编程中&#xff0c;小数都称之为浮点数 浮点数的精度问题 print(0.1 0.2) --------------- 0.30000000000000004 ​​1.可以通过round()函数来控制小数点后位数 round(a b)&#xff0c;则表示…...

观察者模式、订阅者发布者模式、vtk中的观察者模式

文章目录 什么是观察者模式vtk是如何实现的观察者模式.AddObserver什么时候使用观察者模式&#xff1f;什么使用订阅发布者模式?观察者模式的实现订阅发布者的实现总结知识补充: 什么是观察者模式 用于在对象之间建立一对多的依赖关系&#xff0c;当一个对象的状态发生变化时…...

关于element-ui中,页面上有多个el-table并通过v-if、v-else等控制是否显示时,type=selection勾选框失效或不显示的问题

刚开始是勾选框那一列直接空了什么都不显示&#xff0c;搜索了一下说是给el-table标签增加id&#xff0c;加了之后是显示了&#xff0c;但是点击任何选框都会直接取消全部选中效果&#xff0c;翻了半天源码也没发现到底是哪里事件冲突了还是怎么回事&#xff0c;烦了&#xff0…...

Stewart六自由度正解、逆解计算-C#和Matlab程序

目录 一、Stewart并联六自由度正解计算 &#xff08;一&#xff09;概况 &#xff08;二&#xff09;Matlab正解计算 1、参考程序一 2、参考程序二 &#xff08;三&#xff09;C#程序正解计算 1、工程下载链接 2、正解运行计算 &#xff08;四&#xff09;正程…...

C语言 驼峰命名法和下划线命名法

在C语言中&#xff0c;变量命名遵循以下规则&#xff1a; 变量名只能由字母、数字和下划线组成。变量名必须以字母或下划线开头。变量名不能使用C语言中的关键字。变量名中不能出现连续的两个下划线。变量名区分大小写&#xff0c;例如&#xff0c;count和Count被视为两个不同…...

大数据学习(8)-hive压缩

&&大数据学习&& &#x1f525;系列专栏&#xff1a; &#x1f451;哲学语录: 承认自己的无知&#xff0c;乃是开启智慧的大门 &#x1f496;如果觉得博主的文章还不错的话&#xff0c;请点赞&#x1f44d;收藏⭐️留言&#x1f4dd;支持一下博>主哦&#x…...

[sqoop]hive导入mysql,其中mysql的列存在默认值列

一、思路 直接在hive表中去掉有默认值的了列&#xff0c;在sqoop导入时,指定非默认值列即可&#xff0c; 二、具体 mysql的表 hive的表 create table dwd.dwd_hk_rcp_literature(id string,literature_no string,authors string,article_title string,source_title string…...

Surface硬盘不够用?教你用cfadisk把SD卡变本地硬盘(附详细图文)

Surface硬盘扩容实战&#xff1a;用cfadisk将SD卡完美变身本地存储 每次打开Surface的存储设置&#xff0c;看到那根触目惊心的红色容量条&#xff0c;相信不少用户都会感到焦虑。作为微软旗下最受欢迎的移动生产力工具&#xff0c;Surface系列在便携性和性能上表现出色&#x…...

旧手机秒变4K摄像头:Iriun Webcam保姆级配置指南(附USB连接技巧)

旧手机秒变4K摄像头&#xff1a;Iriun Webcam保姆级配置指南&#xff08;附USB连接技巧&#xff09; 你是否曾为台式机缺少高清摄像头而烦恼&#xff1f;又或者手头闲置的安卓手机不知如何利用&#xff1f;将旧手机改造成专业级4K摄像头&#xff0c;不仅成本低廉&#xff0c;还…...

PADS 9.5资源包下载与安装教程:附最新许可证生成工具MentorKG使用指南

PADS 9.5完整资源获取与高效安装实战指南 在电子设计自动化&#xff08;EDA&#xff09;领域&#xff0c;PADS系列软件凭借其稳定的性能和友好的操作界面&#xff0c;始终保持着广泛的市场占有率。作为经典的9.5版本&#xff0c;虽然已不是最新发布&#xff0c;但在许多企业的标…...

Python 字典遍历全攻略:5 种常用方法 + 性能对比 + 实战优化技巧

在 Python 开发中&#xff0c;字典&#xff08;dict&#xff09; 是最常用的数据结构之一&#xff0c;以键值对形式存储数据&#xff0c;具备查询快、易操作的特点。而字典的遍历是日常开发中高频操作 —— 从简单的数据读取&#xff0c;到大规模数据处理、接口返回值解析&…...

课堂教学质量综合评分系统

目录 一、项目环境与目录结构 1. 环境要求 2. 推荐目录结构 二、核心类设计&#xff1a;ClassroomScorer 三、关键代码深度解析 1. 基础路径配置 2. 初始化方法&#xff1a;极致灵活的配置 3. 上下文管理器&#xff1a;统一封装 CSV 读取 4. 数据加载&#xff1a;4 类 …...

三菱电机MR-J5伺服系统实战:如何用CC-Link IE TSN搭建高效生产线(附配置清单)

三菱电机MR-J5伺服系统实战&#xff1a;CC-Link IE TSN智能产线部署指南 在工业4.0的浪潮中&#xff0c;生产线的智能化升级已成为制造业提升竞争力的关键。作为这一变革的核心驱动技术&#xff0c;三菱电机MR-J5系列伺服系统凭借其支持CC-Link IE TSN网络的独特优势&#xff0…...

实践指南:如何使用Cisco DefenseClaw保护你的AI Agent安全

一、背景&#xff1a;AI Agent安全面临的新挑战 最近&#xff0c;开源AI代理框架OpenClaw遭遇了大规模供应链攻击&#xff0c;超过800个恶意技能被植入ClawHub技能市场。这个事件被命名为"ClawHavoc"&#xff0c;它暴露了AI Agent生态的安全漏洞。 作为开发者&#x…...

告别Transformer?手把手复现SegNeXt语义分割模型(附PyTorch代码)

从零实现SegNeXt&#xff1a;用纯卷积架构挑战Transformer的语义分割霸主地位 在计算机视觉领域&#xff0c;语义分割技术正经历着一场静默的革命。当大多数研究者将目光聚焦于Transformer架构时&#xff0c;SegNeXt却用纯粹的卷积神经网络&#xff08;CNN&#xff09;设计刷新…...

VBench评测基准全面解析:如何精准评估视频生成模型性能

1. VBench评测基准&#xff1a;视频生成模型的"体检中心" 想象一下你去医院做全身体检&#xff0c;医生会用不同仪器检查你的视力、听力、心肺功能等各项指标。VBench就是给视频生成模型做全面体检的"三甲医院"&#xff0c;它能从16个维度给模型打分&#…...

Hunyuan-HY-MT1.8B性能报告解读:380ms处理500token实测

Hunyuan-HY-MT1.8B性能报告解读&#xff1a;380ms处理500token实测 1. 测试背景与模型简介 腾讯混元团队最新发布的HY-MT1.5-1.8B翻译模型&#xff0c;以其轻量级架构和卓越性能引起了广泛关注。这个仅有18亿参数的模型&#xff0c;在保持高质量翻译效果的同时&#xff0c;实…...