在前端寫頁面的時候，經常會遇到文字內容過多，需要將超出範圍的內容用省略號來顯示。
overflow:hidden; //超出的文字隱藏
text-overflow:ellipsis; //溢位用省略號顯示
white-space:nowrap; //溢位不換行
這裡css樣式中，必須規定包裹內容的寬度以及將overflow設為hidden。不然會沒有效果。
其中-webkit-line-clamp屬性是規定文字顯示幾行，這裡為1，即表示超過一行就顯示省略號。
實現效果如下：
html文字超過的部分顯示為省略
1.單行文字超出省略 實現方式 overflow hidden white space nowrap 文字不會換行 text overflow ellipsis 顯示省略符號來代表被修剪的文字 實現 用css實現單行文字的溢位顯示省略號,同學你會嗎 p 實現效果 2.多行文字超出省略 實現方式 di...
html文字超過部分顯示為省略號
一 單行文字超出 省略 overflow hidden text overflow ellipsis white space nowrap 文字不換行，這樣超出一行的部分被擷取，顯示.二 多行文字溢位 overflow hidden text overflow ellipsis display we...
文字超出隱藏並顯示省略號
文字超出了需要隱藏並顯示省略號這個在工作中很多時候都要用到，我想很多人都碰到過吧，這個有兩種解決方法 一是用程式開擷取字元長度，這個其實也是可以的 第二種是用樣式來做,這裡主要介紹一下用樣式怎麼來做吧，我話也不多說了吧直接上 吧，css樣式如下 css1 css2 html 如下 divclass ...