CSS 将显示不完的多余字符用省略号代替兼容各主要浏览器 IE6+、FF、Chrom

ellipsis.html

单行文本方法, 通过CSS即可解决
<style>
    
p{
    width: 100px;
    display: block;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    -icab-text-overflow: ellipsis;
    -khtml-text-overflow: ellipsis;
    -moz-text-overflow: ellipsis;
    -webkit-text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

</style>

多行文本通过添加子元素覆盖当前文本右下角模拟实现

<div style="position:relative; overflow:hidden; z-index:1;">
    文字部分。
    <div style="position:absolute; right:0; bottom:0; background-color:#FFFFFF;">...</div>
</div>