文本超出div部分，使用省略(...)表示

例子：

<div style="width:100px; text-overflow:ellipsis; white-space:nowrap; overflow: hidden;">
超级长的文本内容，超出部分会被省略掉。显示省略号！
</div>

备注：div必须标明宽度才可以使用，并且配合使用 white-space:nowrap; overflow: hidden

text-overflow : clip |ellipsis
              clip : 不显示省略标记（...），而是简单的裁切
         ellipsis : 当对象内文本溢出时显示省略标记（...）

 white-space : normal|pre|nowrap 
         normal : 默认值。默认处理方式。文本自动处理换行。假如抵达容器边界内容会转到下一行。
              pre : 换行和其他空白字符都将受到保护。这个值需要IE6+或者 !DOCTYPE 声明为 standards-compliant mode 支持。
                      如果 !DOCTYPE 声明没有指定为 standards-compliant mode ，此属性可以使用，但是不会发生作用。结果等
                      同于 normal 。参阅 pre 对象。
        nowrap : 强制在同一行内显示所有文本，直到文本结束或者遭遇 br 对象。参阅 noWrap 属性。

       overflow : hidden的作用是隐藏溢出

转载于:https://www.cnblogs.com/yuzhoulangzi/p/3449977.html