css 超出显示省略号

/* 单行超出显示省略号 */
#div {
      width: 200px;
      overflow: hidden;  /* 隐藏超出的文本 */
      text-overflow: ellipsis;  /* 用省略号替代被修剪的文本 */
      white-space: nowrap;  /* 控制文本不换行 */
}

效果图

/* webkit内核专用（移动端） --- 多行显示省略号*/
#div2 {
      width: 200px;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 3;/* 要几行后显示省略号 */
      overflow: hidden;
}

效果图