CSS: 經過CSS控制字符串長度（一行或者多行）

• 一行時，超出長度的部分變爲省略號

.text-hidden {
  width:200px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

注：經過width來控制字符串長度

• 多行時，在第n行超出的部分變爲省略號

.text-ellipsis {
  overflow : hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  /* autoprefixer: off */
  -webkit-box-orient: vertical;
  /* autoprefixer: on */
}

注：經過-webkit-line-clamp來控制你要在第幾行省略。默認編譯的時候，-webkit-box-orient: vertical;會被過濾，經過以上註釋的寫法纔可生效，或者在react項目中，在對應須要加樣式的地方添加style屬性：style={{WebkitBoxOrient: "vertical"}}也可生效