0
点赞
收藏
分享

微信扫一扫

display与overflow同时使用时,overflow会失效如何解决


前两天在写业务的时候发现,如果使用了display,overflow的部分功能就会失效。

想要效果:

display与overflow同时使用时,overflow会失效如何解决_人工智能

 但是使用了display和overflow后。。。

代码:



overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
display: flex;



效果:

display与overflow同时使用时,overflow会失效如何解决_html_02

 刚开始不理解,后来发现两个一起使用会失效(因为旁边没有使用display的效果没有问题)。

解决方法一:

当时选择的就是嵌套一个span解决问题。



<div>//使用display
<span>//使用overflow
//值
</span>
</div>



解决方法二:

网上搜索还有一种方法是加一个:



width: 0;



但是在使用过后是没有效果的, 直接空了。

display与overflow同时使用时,overflow会失效如何解决_html_03

这种方法也许是有用的,但是可能是在特定的场合。

举报

相关推荐

0 条评论