如何實現隱藏多餘的字用省略號代替

在前端經常會遇到類似的效果。 例如圖中的「風花雪月與古鎮火山-.....」後面「....」就是一段文字顯示不下的時候預設隱藏然後用…來代替。
  
只需要給元素加上以下3個css屬性就可以實現了。

            overflow: hidden;//多余的隐藏            
            text-overflow:ellipsis;//多出来的用省略号代替            
            white-space: nowrap;//不换行

以上是如何實現隱藏多餘的字用省略號代替的詳細內容。更多資訊請關注PHP中文網其他相關文章！