單選文字及多行文字溢位問題

2022-08-01 03:33:12 字數 623 閱讀 4017

1、單行

html:

測試資料測試資料測試資料測試資料測試資料測試資料測試資料測試資料測試資料測試資料測試資料測試資料

css:

.col_one_text

2、多行

html:

更多收起

測試資料測試資料測試資料測試資料

測試資料測試資料測試資料

測試資料測試資料測試資料

測試資料測試資料測試資料

測試資料測試資料測試資料

測試資料測試資料測試資料

測試資料測試資料測試資料

測試資料測試資料測試資料

測試資料測試資料測試資料

測試資料測試資料測試資料

測試資料測試資料測試資料

測試資料測試資料測試資料

測試資料測試資料測試資料12

css:

.text-outer

.text-outer::after

.addclass

.addclass::after

.more,.shouqi

.more

.shouqi

.shouqi

.more:hover,.shouqi:hover

js:

多行文字溢位

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

單行 多行文字溢位隱藏

單行文字超出隱藏 在這裡插入 片 overflow hidden text overflow ellipsis white space nowrap 多行文字超出隱藏 在這裡插入 片 overflow hidden 超出隱藏 text overflow ellipsis 文字溢位時顯示省略標記 di...

vue多行文字溢位處理

在vue多行文字溢位的問題,工作中需要相容火狐,ie,和谷歌,新增文字kit字首的那種方式火狐和ie不相容,找到一種萬能的方法,如下 mounted fn.xdlines.defaults,options var this this for var k 0 k this.length k var s...