溢出文字省略号显示

1.强制一行文本显示（不让换行）
 
white-space:nowrap;
 
2.超出部分隐藏
 
overflow:hidden;
 
3.文字用省略号代替超出部分
 
text-overflow:ellipsis

<div
     id="fonts"
     style="
       width: 50px;
       height: 100px;
       overflow: hidden;
       background-color: palevioletred;
       text-overflow: ellipsis;
       /* 弹性模型伸缩盒子显示 */
       display: -webkit-box;
       /* 限制一个块级元素的文本行数 */
       -webkit-line-clamp: 2;
       /* 设置或检索伸缩盒子对象元素排列方式 */
       -webkit-box-orient: vertical;
     "
   >
     大家好大叫好大家来到捡垃圾的绿卡角度来看就asks来得及
   </div>