overflow之文字单行显示/三行显示

overflow:

内容溢出处理

overflow: 值如下

• visible（默认）/ 溢出部分 可见
• hidden（超出部分隐藏）/
• scroll（出现滚动条）/
• auto（浏览器自动处理）
• text-overflow：clip（不显示省略标记，简单裁切） | ellipsis（文本溢出显示省略标记）文本溢出处理 读音：爱累扑谁死
• white-space： normal / pre（空白被保留）/nowrap（不换行）/....

1、如果是只需要显示一行+省略号，那么就容易啦

{
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:nowrap;
}

2、如果是需要显示2行或者更多+省略号

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