微信ウィジェットの文字が行を超えた後に隠して省略記号を表示します
694 ワード
ウィジェット開発の過程で、textに完全に表示できないデータがあることが多いので、関連文字を隠すために使用し、後ろに省略記号(...)を付けます.
対応するtextに次のcssを設定するだけでいいです.
しかし、上のcssは単行表示の非表示しか保証できません.2、3、n行で非表示にしたい場合は?この要求も実はcssでできる.次にcssを貼り付けます.
その中の-webkit-line-clampの数字を変えるだけで、対応する需要を実現することができます.
転載先:https://www.cnblogs.com/joe235/p/11322982.html
対応するtextに次のcssを設定するだけでいいです.
overflow:hidden; //
text-overflow:ellipsis; //
white-space:nowrap; // しかし、上のcssは単行表示の非表示しか保証できません.2、3、n行で非表示にしたい場合は?この要求も実はcssでできる.次にcssを貼り付けます.
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
word-wrap: break-word;
white-space: normal !important;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;その中の-webkit-line-clampの数字を変えるだけで、対応する需要を実現することができます.
転載先:https://www.cnblogs.com/joe235/p/11322982.html