css3溢出隐藏显示小数点

.test{
width: 150px;
height:40px;
border:1px solid #000;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}

.test2{
width: 150px;
border:1px solid #000;
display: -webkit-box;
-webkit-line-clamp: 2;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
overflow: hidden;
}
.test3{
width: 150px;
}
p{

text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
}

 

<div class="test">测试在web开发过程中,常常会遇到要让布局中的某些文本根据宽度来显示</div>
<div class="test2">
测试在web开发过程中,常常会遇到要让布局中的某些文本根据宽度来显示

</div>
<div class="test3">
<p>测试在web开发过程中,常常会遇到要让布局中的某些文本根据宽度来显示</p>
</div>

posted @ 2016-07-07 15:59  pikachuWorld  阅读(1925)  评论(0编辑  收藏  举报