給標籤設定固定字元長度，超出部分用省略號顯示。

2021-09-26 09:49:56 字數 518 閱讀 7388

網頁中文字顯示時，有時候往往只需要顯示前面部分內容，通常情況下給標籤加樣式即可解決。

下面總結幾種情況：

第一種情況：單行顯示，超出內容部分省略號顯示。標籤的樣式如下:

div
第二種情況：多行顯示，最後一行的末尾用省略號顯示。下面以3行為例，如要變換行數，只需要改變下面的數字3即可。標籤的樣式如下：

div
以上兩種情況是平時比較多見也是最常用的，最後一種最有意思，它通過設定標籤顯示字元的長度，比如只顯示20個字，超出部分用省略號。這種設定需用到js，下面的例子是我在處理乙個網頁時，多個段落都需要按此設定，所以用到了each函式，**如下：

$("div").each(function()


$(this).text(s);


})
或者直接去掉判斷函式，**如下：

$("div").each(function())

css超出部分用省略號替代

一 單行 實現單行文字的溢位顯示省略號使用text overflow ellipsis屬性，但需要配合使用另外兩個屬性使用才能達到效果。如下 overflow hidden text overflow ellipsis white space nowrap 效果 二 多行 不考慮相容性，適用於web...

css 超出部分用省略號顯示

說明 text overflow 用於多行文字的情況下，用省略號 隱藏超出範圍的文字 display webkit box 將物件作為彈性伸縮盒子模型顯示，是必須結合的屬性。webkit box orient 設定或檢索伸縮盒物件的子元素的排列方式，是必須結合的屬性 一 文字顯示一行，超出部分用省略...

文字超出部分用是省略號顯示

1 文字超出部分用是省略號顯示 text overflow ellipsis overflow hidden white space nowrap whit space屬性 normal 預設。空白會被瀏覽器忽略。pre空白會被瀏覽器保留。其行為方式類似 html 中的標籤。nowrap 文字不會換...