text-overflow:ellipsis失效

text-overflow:ellipses用于设置文本超出显示‘…’，工作中遇到设置不上的问题，所以总结一下。

text-overflow:ellipsis生效的几个必要条件

• over-flow必须为hidden
• white-space必须为‘no-wrap’防止换行

如果还没有效果，考虑它的父级或者本身是否设置了display:flex弹性布局也会导致这个属性失效。有效的解决方法是，在这个元素外层套一个div，然后将文字显示省略号的相关CSS属性设置到这个div上。