当文本内容超出容器宽度时,显示省略标记(...)

当文本内容超出容器宽度时,可以使用CSS中的text-overflow属性来实现文字溢出显示小点点的效果。下面是一种常见的使用方法:

html 复制代码
<style>
 div {
            width: 200px;
            height: 18px;
            font-size: 16px;
            white-space: nowrap; /* 设置文本不换行 */
            overflow: hidden; /* 隐藏溢出部分 */
            text-overflow: ellipsis; /* 文字溢出显示省略号 */
        }
</style>

效果如下:

相关推荐
大雷神12 小时前
HarmonyOS APP<玩转React>开源教程十四:进度管理服务
前端·react.js·开源·harmonyos
小江的记录本12 小时前
【JWT】JWT(JSON Web Token)结构化知识体系(完整版)
前端·网络·web安全·http·网络安全·json·安全架构
kyriewen1112 小时前
Sass 进阶:当 CSS 学会了编程,变量函数循环全都安排上
前端·javascript·css·less·css3·sass·html5
重生之光头强下海当程序猿12 小时前
调整word中的序号格式(缩进,起始值,序号与文字的间距等
前端·css·word
CodeSheep12 小时前
魔幻!MiniMax市值正式超越百度,老板曾是百度实习生,网友一针见血。
前端·后端·程序员
清汤饺子12 小时前
Cursor 从 0 到 1 系列《基础篇》:从零上手 Cursor
前端·javascript·后端
咚咚咚小柒12 小时前
【前端】基础知识类汇总(长期更新)
前端
IT乐手12 小时前
Android 获取类成员值的方法
前端
几何心凉12 小时前
2026数据新规下,远程控制软件安全大起底:ToDesk、向日葵、UU远程谁更能守护企业资产?
前端
IT_陈寒12 小时前
Redis 缓存击穿 vs 雪崩:5个实战方案让你的系统稳如磐石
前端·人工智能·后端