flex自适应宽度由后text-overflow:ellipsis;失效 文本溢出失效

64 0

当我们给元素做了flex后,flex内的子元素宽度自适应,但是当我们给子元素设置文本溢出的时候,发现时候无效的,原因是因为他们的宽度没有限制,也就是说原始的宽度无限制,那么这个原始宽度又怎么说呢?

他有一个优先级:

优先级:flex-basis > width > 内容宽度。

我们可以通过设置max-width或者min-width来限制他的宽度,但是并不是很合适,因为这两个只是一个区间,而我们的设备宽度是不固定的,所以设置一个固定的区间并没有用,我们需要的是这个元素它能在自适应的情况的下文本溢出依旧有效。

我们给这个flex子元素设置width:0;即可,设置一个极小的宽度。

0
  • 本文分类:CSS
  • 本文标签:flex文本溢出
  • 流行热度:已超过 64 人围观了本文
  • 发布日期:2020年06月16日 - 14时12分55秒
  • 版权申明:本文系作者@木灵鱼儿原创发布在木灵鱼儿站点。未经许可,禁止转载。

评论(0)

微信收款码
微信收款码