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

实际上还是有这样的需求的

html 复制代码
<div class="container">
        <span>
           啊啊啊啊啊啊啊啊
        </span>
        你好啊撒撒啊撒撒撒撒啊撒撒撒撒撒说
    </div>

还是有这样的需求的哦。

css 复制代码
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; 核心的玩意就是这个。要使行内块元素文本 和后面的文本内容底部对齐。就可以了饿

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

相关推荐
修己xj4 分钟前
打造专属博文封面神器:一个开源免费的博文封面生成器ThisCover
前端
kyriewen8 分钟前
面试8家前端岗位后,我发现了一个残酷的事实:AI不是加分项,是门槛
前端·javascript·面试
Fighting_p25 分钟前
【面试 - el-select问题及解决】wujie 微前端下子系统 el-select 多选 filterable 过滤失效
前端
吃口巧乐兹26 分钟前
AI 全栈时代,为什么要服务端使用 NestJs
前端
yingyima31 分钟前
Redis 延迟任务队列:凌晨3点服务器报警的救星
前端
weiggle33 分钟前
第三篇:可组合函数(Composable)——Compose 的基石
android·前端
前端环境观察室34 分钟前
别只看 task success:AI Agent 浏览器自动化真正要补的是环境证据链
前端·后端
huakoh35 分钟前
LangChain 实战:用混合检索啃下 1000 页 PDF,搭一个长文档问答 Agent
前端
Dazer0071 小时前
Edge 浏览器绕过 HTTPS 证书错误
前端·https·edge
元让_vincent1 小时前
Spark 2.0:面向 Web 的 3DGS 可视化与大场景渲染平台详解
前端·3d·spark·渲染·轻量化·3dgs·lod