CSSではみ出した文章の末尾を「…」で省略する
一行のみの場合
.ellipsisArea {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}複数行にまたがる場合
この場合、上記の方法は使えない。
理由は、text-overflow: ellipsisで文字を省略できるのは文字が要素をはみ出した場合だけであるため。
複数行の場合はwhite-space: nowrapを外す必要が出てくるが、これを外すと要素をはみ出さなくなってしまう。
やり方としてはいくつかあるが、ブラウザ依存を考えると:beforeと:afterを駆使する方法が一般的。