文字超出用省略號代替寫法

2021-10-24 16:34:11 字數 580 閱讀 1937

預設情況下,當我們給有文字內容的盒子設定固定寬高時,超出會自動換行,

如果也超出了高度,會溢位盒子,顯示在外面

1.超出一行就用省略號代替:

.container
2.超出指定行數才隱藏:

="container"

>

內容長度測試,內容長度測試, 內容長度測試,內容長度測試

內容長度測試,內容長度測試, 內容長度測試,內容長度測試

內容長度測試,內容長度測試, 內容長度測試,內容長度測試

<

/span>

<

/div>

.container

}//注意使用該屬性只能給子元素設定,不能設定給有固定高度的div,

//否則導致雖然第二行有省略號,但後面超出的高度不會隱藏,文字會繼續展示

3.滑鼠移入顯示全部內容的方法:

直接加上下面屬性:

&:hover

css實現超出文字溢位用省略號代替

一 單行 實現單行文字的溢位顯示省略號使用text overflow ellipsis屬性,但需要配合使用overflow hidden white space nowrap這兩個屬性使用才能達到效果。注意 如下 overflow hidden text overflow ellipsis whit...

CSS超出文字指定寬度用省略號代替和文字不換行

一般的文字截斷 適用於內聯與塊 css code複製內容到剪貼簿 對於 文字溢位的定義 對於 超出範圍顯示省略號 css code複製內容到剪貼簿 需要你注意的是,這個css樣式只對單行的文字的效,如果你想把它用在多行上,也只有第一行有作用的。這個寫法只有ie會有 其它的瀏覽器文字超出指定寬度時會隱...

超出文字用省略號表示

1 單行文字 幸福像花兒一樣,我的快樂我做主。臨淵羡魚不如退而結網。你要相信,生活對每乙個人都是公平的,不要灰心不要喪氣。youcan!幸福像花兒一樣,我的快樂我做主。臨淵羡魚不如退而結網。你要相信,生活對每乙個人都是公平的,不要灰心不要喪氣。youcan!幸福像花兒一樣,我的快樂我做主。臨淵羡魚不...