文字省略问题：单行，多行、在弹性盒子内的特殊情况

文章很简单，直接上干货！

1. 如果是想要单行文字省略，直接复制下面这个类名

   1、单行文字，文字省略
   .ellipsis-1 {
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
   }

2. 如果需要多行显示后省略，复制下面这段代码（把这个2改成你想要的就行了）

   .ellipsis-2 {
     overflow: hidden;
     text-overflow: ellipsis;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     -webkit-box-orient: vertical;
   }

3. 特殊情况：文字处于flex 弹性盒子内，overflow：hidden  会失效，这时候需要给父盒子加上两个属性：

   div {
       flex:1;
       witdh:0;
   }

   flex：是用来控制盒子宽度，width用来限制文字不会把弹性盒子撑大！

   ---

干货满满，对您有用的话点个赞呗！