CSS line-clamp

-webkit-line-clamp を利用することで、任意の行数で自動的に文字を切り落として省略記号を付けることができます。

-webkit-line-clamp を利用することで、任意の行数で自動的に文字を切り落として省略記号を付けることができます。

こんなレスポンシブ対応に便利

見出し

本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。

見出し

本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。

見出し

本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。

見出し

本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。

見出し

本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。

見出し

本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。本文のテキストが入ります。