• 理解空白空间的解决

  while-space:nowrap;
  
    1. 文本不换行并保留回车和空格：pre
    2. 文本换行并保留回车和空格：pre-wrap
    3. 文本换行并只保留回车：pre-line
    4. 文本不换行但不保留回车和空格：nowrap

• 理解溢出内容局部解决

  overflow:hidden
  
    1. 溢出不暗藏：visible
    2. 溢出暗藏：hidden
    3. 显示滚动条：scroll
    4. 主动显示滚动条：auto

• 设置单行文本溢出省略号显示

  div{
    width:100px;            // 增加宽度
    while-space:nowrap;        // 设置内容单行显示
    overflow:hidden;        // 设置溢出内容暗藏
    text-overflow:ellipsis;    // 增加省略号
  }

• 设置多行文本溢出省略号显示

  div{
    width: 100px;                    // 增加宽度
    display: -webkit-box;            // 对象作为弹性伸缩盒子模型显示 
    -webkit-box-orient: vertical;    // 设置或检索伸缩盒对象的子元素的排列形式
    -webkit-line-clamp: 3;            // 限度显示行数
    overflow: hidden;                // 设置溢出内容暗藏
  }
  
  留神：须要对不同浏览器进行兼容解决