<!DOCTYPE html>
<html>
<head>
<title>多行换行</title>
<style type="text/css">
div{
overflow: hidden;
/*如果要做到多行换行 需要使用一个webkit内核专用的属性-webkit-line-clamp来设置行数
用其设置行数的时候还要使用-webkit-box-orient来设置行的方向
同样也要使用display:-webkit-box来把这个元素设置成webkit类型的盒子模型*/
/*如果在做多行换行的时候建议不要设定死的高，如果设置了那么设置的高就要设置成能完整显示文本的高度
建议是不设定高度*/
height: 53px;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp:3;
-webkit-box-orient:vertical;
}
</style>
</head>
<body>
<div>welcom to qingyun welcom to qingyun welcom to qingyun welcom to qingyun welcom to qingyun welcom to qingyun welcom to qingyun welcom to qingyun welcom to qingyun welcom to qingyun welcom to qingyun</div>
</body>
</html>
原文：http://www.cnblogs.com/adialike/p/6383759.html