SEARCH

夸米動態

css讓文字在一行及多行顯示,文本超出溢出顯示省略號替代

2022-03-25 09:23:52 內容聲明:以下內容僅供參考,我司未對內容做真實性核驗,請用戶注意分辨!如有任何違法/侵權信息,請立即聯系我們刪除

1. 例如 p元素,里面的文字不換行,超出部分用省略號代替

p{
width:100%;
word-break:keep-all;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}

2. 多行文本顯示省略號,省略號在斷尾

p{
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
width: 100%;
}

因使用了WebKit的CSS擴展屬性,該方法適用于WebKit瀏覽器及移動端; 


注:   

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


常見結合屬性:   

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

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

丨夸米科技

咨詢直線:186-2370-8562  官方網站:www.www.tysjjz.com

?

*請認真填寫需求信息,我們會在24小時內與您取得聯系。

LOGO

地址

重慶市渝北區金開大道西段106號創新科技園區3座4樓

鄭州市中原區電廠西路西三環交叉口大學科技園東區15E

聯系

18623708562
[email?protected]
重慶夸米網絡科技有限公司 版權所有 盜版必究 備案號:渝ICP備16002041號-2 內容聲明:網站內容中非對我司進行介紹(包括但不限于案例、資訊)的描述內容僅供參考,如用戶發現有任何違法/侵權信息,請立即聯系我們刪除
开裆露小内裤奶头白丝jk美女|国产一级婬片a免费播放囗|午夜亚洲中文字幕一区二区三|国产成人综合亚洲欧美在线欧亚