uniapp 兩行顯示,多餘用省略號代替

2021-10-25 10:57:18 字數 328 閱讀 6112

如果要想顯示兩行,超出用省略號表示

-webkit-line-clamp用來限制在乙個塊元素顯示的文字的行數。 為了實現該效果,它需要組合其他的webkit屬性。 常見結合屬性:

display: -webkit-box; 必須結合的屬性 ,將物件作為彈性伸縮盒子模型顯示 。

-webkit-box-orient 必須結合的屬性 ,設定或檢索伸縮盒物件的子元素的排列方式 。

text-overflow: ellipsis;,可以用來多行文字的情況下,用省略號「…」隱藏超出範圍的文字 。

css超出兩行顯示省略號

1.css寫法只對webkit核心的瀏覽器好用,對safari瀏覽器有相容問題.demo2.css超出兩行顯示省略號 個人寫法 twolines article ref article content ref p p cover v if isshow span div div template e...

一行省略,兩行省略

一行省略 1 得是以配置為inline block的元素,或缺省以block呈現的div p元素 2 強制不換行 3 固定寬度 4 超出部分隱藏 5 超出部分以 結尾 width 140px display inline block white space nowrap overflow hidde...

CSS設定文字一行或者兩行顯示,多餘部分顯示省略號

一行顯示否則省略號 word break break all 屬性規定自動換行的處理方法。normal 使用瀏覽器預設的換行規則。break all 允許在單詞內換行。keep all 只能在半形空格或連字元處換行。text overflow ellipsis display webkit box ...