純CSS :after實現省略號

.overflowEllipsis {
  /* overflow: hidden;
  text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  white-space: nowrap; */
  /* display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:1;
text-overflow:ellipsis; */
overflow:hidden;
/* word-break:break-all; */
}
.overflowEllipsis:after{
  content: '...';
}

效果:

缺點：

無法判斷是超出長度才顯示，省略號會一直顯示，除非結合js實現