css控制文字溢出省略号显示

1.css控制（前提一定要给p标签定义固定宽度和高度）
p {

    width:100px;

    height:24px;

    overflow: hidden;

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

}

/*隐藏超出部分文字*/
overflow: hidden;
/*多出文字后添加省略号*/
text-overflow: ellipsis;
/*强制不换行*/
white-space: nowrap;

 

2.js控制（基于jQuery，先引入jQuery库，这个和后台处理的原理一样）
$("p").each(function(){
    var p_height = $(this).height();
    var $p = $("p", $(this)).eq(0);
    while ($p.outerHeight() > p_height) {
        $p.text($p.text().replace(/(\s)*([a-zA-Z0-9]+|\W)(\.\.\.)?$/, "..."));
    };
});