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

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

• 多行文本显示省略号

display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;   行数
overflow: hidden;

• 补充一点点：单行文本分散对齐（两端对齐）
  • 方法一

.box{
  display: inline-block;
  width: 100px;
  text-align: justify;
  text-align-last: justify;
  text-justify:distribute-all-lines;  // 兼容ie
}

• 方法二

    span{
      display: inline-block;
      width: 100px;
      text-align: justify;
      vertical-align: top;
    }
    span::after{
      display: inline-block;
      width: 100%;
      content: '';
      height: 0;
    }

使绝对定位内部元素不继承父级宽度，而是靠内容自动撑开宽度

在需要宽度自动撑开的元素上面添加样式：

white-space:nowrap