标签：
1、单行文本溢出
p {
overflow : hidden;
text-overflow: ellipsis;
white-space:nowrap;
}
2、多行文本溢出——单纯只用css方法只有用非标准样式且只兼容webkit内核或者opera浏览器
2.1—— -webkit-line-clamp属性
p {
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
2.2——-o-ellipsis-lastline属性
p {
overflow: hidden;
white-space: normal;
height: 3em;
text-overflow: -o-ellipsis-lastline;
}
3、跨浏览器兼容方法——jquery
原理：通过从后向前逐个删除末尾字符，直至元素的高度小于父元素高度，之后用省略号代替所有字符
$(".figcaption").each(function(i){
var divH = $(this).height();
var $p = $("p", $(this)).eq(0);
while ($p.outerHeight() > divH) {
$p.text($p.text().replace(/(\s)*([a-zA-Z0-9]+|\W)(\.\.\.)?$/, "..."));
};
});
标签：
原文地址：http://www.cnblogs.com/mmlvj/p/4641559.html
