多行文字溢位顯示省略號

2021-07-28 13:09:08 字數 356 閱讀 7249

這裡是i喵醬,這個是乙個多行超出換行的小demo,看這裡看這裡~~

overflow:hidden;內容會被修剪,超出隱藏。

text-overflow: ellipsis; 超出範圍顯示「...」。

display: -webkit-box; 把物件轉換成彈性盒模型 。

-webkit-box-orient: vertical;設定或檢索伸縮盒物件的子元素的排列方式 。

-webkit-line-clamp: 9;後面引數代表顯示幾行

css3新增屬性可能存在描述錯誤及變更,僅供參考,持續更新。

.overflow

有相容問題~ 

多行文字溢位顯示省略號

大家應該都知道用text overflow ellipsis屬性來實現單行文字的溢位顯示省略號 當然部分瀏覽器還需要加寬度width屬性。css overflow hidden text overflow ellipsis white space nowrap 但是這個屬性並不支援多行文字溢位顯示省...

多行文字溢位顯示省略號

大家應該都知道用text overflow ellipsis屬性來實現單行文字的溢位顯示省略號 當然部分瀏覽器還需要加寬度width屬性。overflow hidden text overflow ellipsis white space nowrap 但是這個屬性並不支援多行文字溢位顯示省略號,這...

多行文字溢位顯示省略號

單行文字的溢位顯示省略號 text overflow ellipsis 部分瀏覽器還需要加寬度width屬性。overflow hidden text overflow ellipsis white space nowrap 多行文字溢位顯示省略號 在webkit瀏覽器或移動端 絕大部分是webki...