場景需求

• 前幾天在公司寫小程序的時(shí)候，發(fā)現(xiàn)有個(gè)樣式重復(fù)書寫，很是煩人，就是文本的超出換行顯示省略號(hào)以及多行顯示省略號(hào)，我就將這個(gè)樣式抽取出來，在這里做下記錄，后面再遇到可以來這里復(fù)制??

CSS 實(shí)現(xiàn)超出一行文本顯示省略號(hào)

.single-line-text {
  width: 300px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

CSS 實(shí)現(xiàn)超出多行文本顯示省略號(hào)

.multiple-line-text {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

至此，又多了一個(gè)快速尋找代碼片段的文章。??