很多情况都要求多余的文字要以省略号的形式展示在前端页面上。

超新星

1. .css{
   
2.     width:200px;//示例宽度
   
3.     height:40px;//示例高度
   
4.     overflow:hidden;
   
5.     width-space:nowrap;
   
6.     text-overflow: ellipsis;
   
7.     overflow: hidden;
   
8.     white-space: nowrap;
   
9. }

复制代码

多行文字超出规定宽度和高度后，以省略号形式展示：
这种情况需要给装文字的盒子设置属性为box属性；

1. .css{
   
2.      width:200px;
   
3.     height:100px;
   
4.     display:-webkit-box;
   
5.    -webkit-box-orient:vertical;
   
6.    -webkit-line-clamp:;//根据业务需求设置
   
7.    overflow:hidden;
   
8. 
   
9. }

复制代码