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

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

相关推荐
步行cgn14 小时前
为什么既要 web.xml 又要 springmvc.xml?能不能只配一个?
xml·前端·hive
风骏时光牛马14 小时前
大模型综合能力评测:多维度性能与对齐效果对比
前端
winfredzhang14 小时前
从零手写一个毛玻璃风格的页面搭建台:单文件 HTML 实现组件放置、面板磁吸与图层管理
前端·html
葡萄城技术团队1 天前
1000 人协同压测的环境瓶颈排查:CPU 争用与 Wi\-Fi
前端
excel1 天前
Marked 与 Markdown 有什么区别?该怎么选?
前端
Da Da 泓1 天前
五子棋 Web 端测试用例报告
前端·网络·websocket·网络协议·测试用例·项目
zxcvb1531 天前
远程查看本地文档:一条轻量 Web 文件服务的工程化链路
前端·远程查看文档
niucloud-admin1 天前
NIUCLOUD PHP SAAS上门家政使用文档:城市管理
java·前端·php
北岛贰1 天前
啵啵音乐迎来全新升级!
前端
hkNaruto1 天前
【AI】基于大模型的AI游戏地图生成、控制方案:AI Native Game Harness 迁移操作手册
前端·人工智能·游戏