一、单行省略:
<div class="positionInfo">中国北京海淀区北京大学计算机与信息工程</div>
.positionInfo{
width:200px //限制宽度,根据实际开发需求设置
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
显示:中国北京海淀区北京大....
二、多行省略
<div class="positionInfo">中国北京海淀区北京大学计算机与信息工程</div>
width:100px //限制宽度,根据实际开发需求设置
overflow: hidden;
text-overflow: ellipsis; //省略号
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2; //显示行数
显示:
中国北京海淀区
北京大学计...