css设置文字不换行 超出容器部分省略

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

首先设置overflow：hidden，超出部分隐藏。

然后设置text-overflow：ellipsis，以省略号代替被省略的文字

text-overflow还有另外两个值。

一共三个值如下：

最后是设置white-space：nowrap 合并空格 并且不换行

当然white-space 空格处理 也有很多属性

最后我也做了小小的实验， 貌似overflow属性不写，text-overflow的值clip和ellipsis的效果都是一样的，都是超出部分被裁掉了。