千丝海阁

当一个块元素里的文字过长时，文字往往会延伸到块元素之外，很明显，这不是我们想要的效果，一般来说，我们希望文字能够自动截断并显示在块元素内。如果是以前，那么势必是用计算文字长度的方法，先计算出总文字长度l，再计算出多余的文字长度n，然后显示l-n个文字到元素内，而现在用css的话，只要一两行代码就能轻松搞定，来看一下简单示例。

上面的图明显下方的文字介绍部分明显过长，自动换行了，导致整个版面样式错位。我们在这里加上下面一行css试试。

white-space:nowrap;   /*强制不换行*/

可以看到效果变了，所有文字都在同一行内了，这是因为了nowrap的效果，但是另一个问题也随着来了，文字过长了，顶出格了。于是再加上下面一行来看看效果。

overflow:hidden;

好了，果断达到了目的。这里tiandi还有个疑问，网上有介绍text-overflow这个属性，但是无论tiandi设置成ellipsis还是clip，在chrome下都没有明显效果，不知道问题何在。