flex布局文本溢出显示省略号...不好使
<div style="width: 0px; display: flex; flex-grow: 1;">hellowww.baidu.comhello@baidu.com</div>这种格式永远也不显示省略号，百度后是因为：容器的子容器是文本，但是你不能将任何CSS直接应用于文本，因为它是匿名FLEX项目(即，没有定义标记的FLEX项)。因此，你需要将...
·
<div style="width: 0px; display: flex; flex-grow: 1;">
hellowww.baidu.comhello@baidu.com
</div>这种格式永远也不显示省略号，百度后是因为：
容器的子容器是文本，但是你不能将任何CSS直接应用于文本，因为它是匿名FLEX项目(即，没有定义标记的FLEX项)。因此，你需要将文本包装到一个元素中，然后应用省略号代码。
所以改成下面这样：
<div style="width: 0px; display: flex; flex-grow: 1;">
<span style="overflow: hidden; white-space: nowrap;text-overflow: ellipsis;">
hellowww.baidu.comhello@baidu.com
</span>
</div>这样就好使了
权威｜前沿｜技术｜干货｜国内首个API全生命周期开发者社区
更多推荐
4
0- 0
已为社区贡献4条内容
所有评论(0)