CSSスタイル：単一行/複数行のテキストオーバーフローの非表示、代わりに省略記号

単一行のテキストオーバーフローの非表示：

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

注：オーバーフロー：非表示。それ自体がブロックレベルの要素に作用します。テキストを囲む要素がインライン要素である場合、インライン要素は子要素によってサポートされており、要素を切り取ることができないため、オーバーフローは有効になりません。したがって、display：blockを追加して、インライン要素をブロックレベルの要素に変換します。

display: block; /* 如果是行内元素要转换成块级元素 */
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;

複数行のテキストオーバーフローの非表示

display: -webkit-box;
-webkit-box-orient: vertical; /* 设置对齐模式 */
-webkit-line-clamp: 3; /* 设置显示行数 */
overflow: hidden;
text-overflow: ellipsis;

複数行のテキストは、Webkitカーネルの固有の属性を利用する必要があります。
アラインメントモードを設定します：その他のモードリファレンス->新人チュートリアル