span内容超出部分以...显示

最新推荐文章于 2024-08-21 10:29:52 发布

愤怒的阿木木

最新推荐文章于 2024-08-21 10:29:52 发布

阅读量2.2k

点赞数 1

分类专栏： Vue web学习日志文章标签： css

本文链接：https://blog.csdn.net/qq_44364267/article/details/124277486

版权

Vue 同时被 2 个专栏收录

15 篇文章 1 订阅

订阅专栏

web学习日志

8 篇文章 0 订阅

订阅专栏

本文探讨了如何使用CSS技巧，如max-width、overflow和white-space属性，创建一个不超过10个字符宽度的span元素，确保内容超出时以省略号表示，适合于块级展示。作为算法专家，我们将深入解析这些技术在实际开发中的运用和优化。

摘要由CSDN通过智能技术生成

span内容超出部分以…显示

 <span style="display: block;//成为“块级”元素(block-level)；span元素的默认display属性值为“inline”，
 max-width: 10em;//限制字数
 overflow: hidden;//对溢出内容的隐藏
 white-space: nowrap;//只保留一个空白，文本不会换行，会在在同一行上继续，直到遇到br标签为止。
 text-overflow: ellipsis//使得超出部分用“ … ”代替
 ">内容</span>

在这里插入图片描述

愤怒的阿木木

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
span内容超出部分以...显示

span内容超出部分以…显示 <span style="display: block;//成为“块级”元素(block-level)；span元素的默认display属性值为“inline”， max-width: 10em;//限制字数 overflow: hidden;//对溢出内容的隐藏 white-space: nowrap;//只保留一个空白，文本不会换行，会在在同一行上继续，直到遇到br标签为止。 text-overflow: ellipsis//使得超出部分用“ … ”代替
复制链接

扫一扫

专栏目录