CSS line-clamp
- 作業草案 (WD)display: -webkit-box
と組み合わせて使用すると、テキストを指定行数に制限するCSSプロパティです。text-overflow: ellipsis
を含めると、末尾に省略記号(...)が付きます。
Chrome
- 4 - 13:サポート状況不明
- 14 - 123:サポート済み
- 124:サポート済み
- 125 - 127:サポート済み
Edge
- 12 - 16:サポートされていません
- 17 - 18:サポート済み
- 79 - 123:サポート済み
- 124:サポート済み
Safari
- 3.1 - 4:サポートされていません
- 5 - 17.3:サポート済み
- 17.4:サポート済み
- 17.5 - TP:サポート済み
Firefox
- 2 - 67:サポートされていません
- 68 - 124:サポート済み
- 125:サポート済み
- 126 - 128:サポート済み
Opera
- 9 - 12.1:サポートされていません
- 15 - 108:サポート済み
- 109:サポート済み
IE
- 5.5 - 10:サポートされていません
- 11:サポートされていません
Chrome for Android
- 124:サポート済み
Safari on iOS
- 3.2 - 4.3:サポートされていません
- 5 - 17.3:サポート済み
- 17.4:サポート済み
- 17.5:サポート済み
Samsung Internet
- 4 - 23:サポート済み
- 24:サポート済み
Opera Mini
- 全て:サポートされていません
Opera Mobile
- 10 - 12.1:サポートされていません
- 80:サポート済み
UC Browser for Android
- 15.5:サポート済み
Android ブラウザ
- 2.1 - 2.2:サポート状況不明
- 2.3 - 4.4.4:サポート済み
- 124:サポート済み
Firefox for Android
- 125:サポート済み
QQ Browser
- 14.9:サポート済み
Baidu Browser
- 13.52:サポート済み
KaiOS Browser
- 2.5:サポートされていません
- 3:サポート済み
旧バージョンのOperaブラウザ(Prestoベース)も、独自の-o-ellipsis-lastline;
値をtext-overflow
に使用することで、同じ効果をサポートしていました。
- リソース
- CSS Tricksの記事