如何實現隱藏多余的字用省略號代替
來源:懂視網
責編:小采
時間:2020-11-27 18:50:05
如何實現隱藏多余的字用省略號代替
如何實現隱藏多余的字用省略號代替:在前端經常會遇到類似的效果。 比如圖中的風花雪月與古鎮火山-.....后面....就是一段文字顯示不下的時候默認隱藏然后用…來代替。 只需要給元素加上以下3個css屬性就可以實現了。 overflow: hidden;//多余的隱藏 text-overflow:el
導讀如何實現隱藏多余的字用省略號代替:在前端經常會遇到類似的效果。 比如圖中的風花雪月與古鎮火山-.....后面....就是一段文字顯示不下的時候默認隱藏然后用…來代替。 只需要給元素加上以下3個css屬性就可以實現了。 overflow: hidden;//多余的隱藏 text-overflow:el
在前端經常會遇到類似的效果。 比如圖中的“風花雪月與古鎮火山-.....”后面“....”就是一段文字顯示不下的時候默認隱藏然后用…來代替。
只需要給元素加上以下3個css屬性就可以實現了。
overflow: hidden;//多余的隱藏
text-overflow:ellipsis;//多出來的用省略號代替
white-space: nowrap;//不換行
聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com
如何實現隱藏多余的字用省略號代替
如何實現隱藏多余的字用省略號代替:在前端經常會遇到類似的效果。 比如圖中的風花雪月與古鎮火山-.....后面....就是一段文字顯示不下的時候默認隱藏然后用…來代替。 只需要給元素加上以下3個css屬性就可以實現了。 overflow: hidden;//多余的隱藏 text-overflow:el