複数行のテキスト省略記号の実現html
1660 ワード
マルチラインテキスト省略記号の実装
Document
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloribus qui, sed laudantium?
Hic facilis eius eveniet quisquam, voluptatibus molestias, soluta. Odit dicta et omnis
fugiat magnam commodi reiciendis consequatur quosLorem ipsum dolor sit amet, consectetur
adipisicing elit. Impedit quis dolore, assumenda veniam deserunt suscipit maxime, magni
doloremque excepturi praesentium ea ullam earum rem vel voluptatibus ex omnis odio ipsum.
いくつかの属性が必要です。
text-overflow:ellipsis:単行テキストのオーバーフロー表示省略記号(...);複数行のテキストの場合は、省略記号(...)範囲外のテキストを非表示
display:-webkit-box:オブジェクトを伸縮ボックスモデルとしてを表示
-webkit-line-clamp:6:1つのブロック要素にテキストを表示する行数を制限する-webkit-box-orient:vertical:伸縮ボックスオブジェクトのサブエレメント配列を設定または取得