Css文字超出省略变...

在我们的项目中经常会用到超出隐藏为...的情况，比如你不知道你将要显示的文字个数有多少。

像这个：

Paste_Image.png

毫无疑问，这个地址有可能会很长，但我不能任由它影响我的布局

解决办法也很简单，只需要在你外容器加上这个样式就可以了：

.of-hidden {
    display: inline-block;
    white-space:nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

但是要说明一点，外容器是需要设置固定宽度的