CSSの「text-overflow」を使用したデモページ

CSSの「text-overflow: ellipsis;」を適用して、表示領域からオーバーしたテキストを省略して表示しています。

■ 指定なし

テストテストテストテストテストテストテストテストテストテストテストテストテスト

■ text-overflow: ellipsis;を適用

テストテストテストテストテストテストテストテストテストテストテストテストテスト
testtesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttesttest

■ テキストを改行した場合

testtesttesttesttesttesttest
testtesttesttesttesttesttest testtesttesttesttesttesttest
testtesttesttesttesttesttest testtesttesttesttesttesttest
testtesttesttesttesttesttest

■ ブラウザの幅を変更

テストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテストテスト