CSS 文字超出隐藏

demo

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

• white-space 设置如何处理元素中的空白 demo
  • normal连续的空白符会被合并，换行符会被当作空白符来处理。填充line盒子时，必要的话会换行。
  • nowrap连续的空白符会被合并。但文本内的换行无效
  • pre连续的空白符会被保留。在遇到换行符或者
    元素时才会换行。
  • pre-wrap连续的空白符会被保留。在遇到换行符或者
    元素，或者需要为了填充line盒子时才会换行
  • pre-line连续的空白符会被合并。在遇到换行符或者
    元素，或者需要为了填充line盒子时会换行。

• text-overflow属性确定如何向用户发出未显示的溢出内容信号
  • ellipsis ...
• direction用来设置文本、表列水平溢出的方向
  • ltr从左到右
  • rtl从右到左