文字溢出显示省略'…'

在做静态页面的有时候，有些文字内容我们考虑不多，就简单的写几个文字放在那里显示，浏览静态文件的时候没什么问题，当后台开发讲页面套好数据后，可能有些文字比较长，这样我们以前定义单行的内容就会出现换行，页面的改区域就不能正常显示了，出现错位。这个问题我需要提前想到，解决办法有很多种，前端和后台都有处理的方法。

前端方面处理方法

css控制（前提要定义固定宽度）

p {
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

js控制（基于jQuery，这个和后台处理的原理一样）

$("p").each(function(i){
    var pH = $(this).height();
    var $p = $("p", $(this)).eq(0);
    while ($p.outerHeight() > pH) {
        $p.text($p.text().replace(/(\s)*([a-zA-Z0-9]+|\W)(\.\.\.)?$/, "..."));
    };
});

后台处理方法也是截取相应的字段，不同语言都有相应的方法。