css-单行与多行文本超出处理

1. 自动换行

   word-wrap:break-word;
   word-break:normal;
   

2. 强制不换行

   white-space:nowrap;
   

3. 强制英文单词换行

   word-break:break-all;
   

4. 单行文本不换行多余文本显示省略号

   width:200px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   

5. 多行溢出隐藏，显示省略号（IE浏览器不支持）

   word-break:break-all;
   display:-webkit-box;  // 对象作为伸缩盒子模型展示
   -webkit-box-orient:vertical;  // 设置或检索伸缩盒子对象的子元素的排列方式
   -webkit-line-clamp:3;  // 显示的行数 
   overflow:hidden;  // 隐藏超出的内容
   
   兼容浏览器的思路：可以通过js截取一定数量的字符串后，后面添加“...”