知识点------文字超出（单行，两行）显示省略号（...）

文字超出单行不换行，显示省略号

.word {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;   --------------- 单词不换行

  word-wrap: break-word; --------------- 整个单词换行
  word-break: break-all; --------------- 单词内换行 (单行显示省略号，后面两个属性可以不加)
}

文章超出两行出现省略号...

overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;   // ============这里指的是要实现对应number的行数，实现多行的关键点
-webkit-box-orient: vertical; 



英文单词时：
word-wrap:break-word; --- word-wrap: 属性允许长单词或URL地址换行到下一行, break-word: 单词内换行
word-break:break-all;  ------------------ word-break: 规定自动换行的处理方式，break-all: 允许单词内换行



总结：
word-wrap: break-word；  ------------ 整个单词换行
word-break: break-all;   ------------ 单词内换行
white-space: nowrap;     ------------ 单词不换行