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

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

相关推荐
亿元程序员11 分钟前
为什么大家都那么喜欢用Shader?
前端
Codebee13 分钟前
OODER Studio设计工具导入体系深度解析
前端
weedsfly16 分钟前
前端开发中的命令模式——从点餐退单到异步任务调度
前端·javascript·面试
慢功夫17 分钟前
💡第四篇:编辑器内核, Monaco model、URI、dirty 状态和 tabs 是怎么协作的?
前端·visual studio code
小马过河R19 分钟前
微前端实践:从概念、原理到 qiankun 落地
前端·人工智能·前端框架
用户0595401744627 分钟前
AI记忆存储一致性踩坑实录:每天手工回归200条对话,直到我用pytest+Redis搭建自动化验证
前端·css
weedsfly28 分钟前
前端中的适配器模式 vs 外观模式
前端·javascript·面试
图扑软件29 分钟前
其域创新 × 图扑软件|3DGS 高斯泼溅智慧钢厂实景孪生
前端·低代码·3d·编辑器·图形渲染·可视化
labixiong30 分钟前
写给前端的 Generator 指南:从 yield 到 async/await 的完整进化
前端·javascript·前端框架
asdzx6731 分钟前
使用 Spire.WordJS 在 React 中实现在线 Word 文档编辑
前端·react.js·word