javascript - web前端如何判断一段内容是否满两行？(屏幕宽度不同情况下)

Question

有没有什么办法计算一段文字在不同大小屏幕下占用的行数？ 如图，如果在用户手机屏幕宽度下内容超出两行则显示阅读全文，否则不显示阅读全文

我想大声告诉你 · Answer

外側のレイヤーでフレックスレイアウトを使用し、高さの行数を設定するか、外側のレイヤーで最大高さmax-heightを指定します
内側のレイヤーのpにテキストを配置し、通常どおり表示します

リーリー

html構造:

リーリー

次に、2 人の身長を判断します:

リーリー

今度は「もっと見る」が表示されます

给我你的怀抱 · Answer

行の高さに基づいて判断するという考え方です。行の高さが 1 行の高さよりも大きい場合は、コンテンツが 2 行あることを意味します。コードは次のとおりです:

htmlは次のとおりです:

リーリー

jsは以下の通りです:

リーリー

コーディングは簡単ではありませんが、気に入ったらいいねしてください〜

阿神 · Answer

次に行の高さを判断します

巴扎黑 · Answer

現在のテキストには別の dom があり、その高さと行の高さを取得して動的に計算する必要があります

曾经蜡笔没有小新 · Answer

アイデアを提供するには、行の高さを 20px に設定し、ページがレンダリングされた後、js のノードの offsetHeight 属性を使用します。offsetHeight / 20は行数です

过去多啦不再A梦 · Answer

使う

リーリー

以上です

php 8、私も来ます