CSS实现内容超出显示范围自动加"..."

之前在web开发中一直用js来控制如文本内容超出显示范围用substring截取内容然后连接一个"..."字符串。

今天上网无意间发现CSS模式中有这个一个text-overflow样式拿来试试。要比js控制简单的多。

但要注意样式的书写顺序：

overflow: hidden;/*注意不要写在最后了*/

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