CSS實現單行 多行文字溢位部分省略( )顯示

2021-10-01 01:24:32 字數 620 閱讀 6480

**如下:

氛圍是他個人會有人推薦用他人看天空娛樂戶人家軟體園如瑞今天一天射日訪問與太熱亢個如

效果:

氛圍是他個人會有人推薦用他人看天空娛樂戶人家軟體園如瑞今天一天射日訪問與太熱亢個如

但實際上效果是這樣的,並沒有起到作用:

因此有很多人說用js來配合解決,手動新增...標籤,新增::after什麼的。我覺得太麻煩不想寫。終於,在我的不懈努力下,找到了解決辦法:

氛圍是他個人會有人推薦用他人看天空娛樂戶人家軟體園如瑞今天一天射日訪問與太熱亢個如

問題解決了,注釋裡的**不容小視。webpack打包後-webkit-box-orient會被移除,autoprefixer會自動移除老式過時的**,所以需要新增注釋關閉autoprefixer,但是如果有清除注釋的外掛程式,請將該外掛程式設為false,否則不生效。

css實現單行(多行)文字溢位顯示

overflow hidden text overflow ellipsis white space nowrap 當然還需要加寬度width屬來相容部分瀏覽。以上為單行文字溢位 以下為多行文字溢位 display webkit box webkit box orient vertical webk...

css 處理 單行 多行 文字溢位

1 單行溢位 前提必須有寬度 width 300px whitewhite space nowrap 文字不會換行。overflow hidden 溢位多餘裁剪 text overflow ellipsis 顯示省略符號來代表被修剪的文字。2 多行文字溢位 因使用了webkit的css擴充套件屬性,...

單行 多行文字溢位隱藏

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