css 控制字元顯示長度

2021-08-19 09:46:14 字數 533 閱讀 1736

css**:

html**:

使用css限制顯示內容的長度,被隱藏的部分使用「...」顯示

其中:width:200px:指定 div 的寬度; overflow:hidden:超出的內容隱藏;  text-overflow:ellipsis:/ie專用屬性,文字溢位時顯示省略標記();其他瀏覽器不支援;  white-space:nowrap:強制內容不換行。強制在同一行內顯示所有文字,直到文字結束或者遭遇 br 元素。

如果想讓某個容器(div或者li或者...塊級元素)顯示一行文字,當文字內容過多時,不換行,而是出現省略號,可以使用text-overflow屬性,還必須定義:強制文字在一行內顯示(white-space:nowrap)及溢位內容為隱藏(overflow:hidden)。只有這樣才能實現溢位文字顯示省略號的效果。

如果你想要多行文字最後出現省略號,那麼單純的html和css是做不到的,必須用js或者其他後台語言實現。

以下**可以限制到顯示幾行
.content

CSS控制字元長度和顯示長度

在網頁設計中,會遇到文字超過固定長度導致整體的網頁變形的情況。程式設計師往往需要擷取固定的長度來實現某些固定長度的控制.介紹一種直接採用css的 控制來實現文字擷取的方法。與程式設計師的直接字元擷取的方式有點區別,其優勢是可以自動控制文字顯示的長度 缺點是不同瀏覽器的相容性並不完美。使用到 over...

用CSS來控制字元長度和顯示長度

用css來控制字元長度和顯示長度 在網頁排版設計中,會遇到文字超過固定長度導致整體的網頁變形的情況。程式設計師往往需要擷取固定的長度來實現某些固定長度的控制。介紹一種直接採用css的 控制來實現文字擷取的方法,與程式設計師的直接字元擷取的方式有些區別,其優勢是可以自動控制文字顯示的長度 缺點是不同瀏...

字元中包含不顯示的控制字元

碰到乙個unicode字符集的問題,記錄一下 拷貝了乙個手機號直接貼上到平台 儲存,結果傳送簡訊時該手機號接收不到,網上查了才知道原來拷貝到手機號包含了不顯示unicode字元 u202d 一般用到unicode 控制字元有 1 rlo code u202e html 開始從右到左的文字 2 lro...