Web中的省略號

2021-06-17 16:28:12 字數 749 閱讀 8392

在web開發中,對於一種情況很常見。那就是,文字太長,而放置文字的容器不夠長,而我們又不想讓文字換行,所以,我們想使用省略號來解決這個問題。但是,在今天html的標準中並沒有相關的標識或屬性讓你可以簡單地完成這個事。但是我們可以使用css樣式表來完成這個事,在ie,safari,chrome,opera中都可以。但在firefox中卻不行,但我們可以使用jquery來解決firefox不相容的問題。下面是相關的**示例。

使用css設定省略號1

2

3

4

5

overflow: hidden;

text-overflow: ellipsis;

-o-text-overflow: ellipsis;

white-space: nowrap;

width: 100%;

使用jquery設定省略號1

2

3

$(document).ready(function()

或是1

$("span").ellipsis();

Web中的省略號

在web開發中,對於一種情況很常見。那就是,文字太長,而放置文字的容器不夠長,而我們又不想讓文字換行,所以,我們想使用省略號來解決這個問題。但是,在今天html的標準中並沒有相關的標識或屬性讓你可以簡單地完成這個事。但是我們可以使用css樣式表來完成這個事,在ie,safari,chrome,ope...

文字單行省略號 多行出現省略號

第一種僅支援單行省略 width value overflow hidden text overflow ellipsis white space nowrap 第二種支援多行省略 width value overflow hidden text overflow ellipsis display ...

文字超出省略號之前後省略號實現

標籤 css js 最近在做聊天記錄需求時,對於查到的訊息體需要高亮顯示,前後內容超出需要顯示省略號,效果如下圖 對於後省略號是可以通過的一串css來實現的,主要是css的 段如下 css省略號 段 overflow hidden text overflow ellipsis position re...