在CSS中,當(dāng)文本內(nèi)容超出其包含元素的高度時(shí),可以通過設(shè)置overflow
屬性來控制文本的顯示方式。overflow
屬性可以設(shè)置為hidden
、scroll
、auto
或initial
等,其中hidden
表示超出部分的文本將被隱藏,scroll
和auto
表示將顯示滾動(dòng)條,而initial
則重置為瀏覽器的默認(rèn)值。
假設(shè)有一個(gè)高度為200px的div元素,里面有一段很長的文本,可以通過以下CSS樣式來設(shè)置文本超出隱藏:
div { height: 200px; overflow: hidden; }
這樣,當(dāng)文本內(nèi)容超出div元素的高度時(shí),超出部分的文本將被隱藏,也可以通過設(shè)置text-overflow
屬性來控制文本超出時(shí)的顯示方式,如設(shè)置為ellipsis
表示超出部分的文本將顯示為省略號(hào)(...)。
div { height: 200px; overflow: hidden; text-overflow: ellipsis; }
還可以通過設(shè)置white-space
屬性來控制文本的換行方式,如設(shè)置為pre-line
表示文本將自動(dòng)換行,而設(shè)置為pre
則表示文本將不會(huì)換行。
通過CSS的overflow
、text-overflow
和white-space
屬性,可以實(shí)現(xiàn)對(duì)文本超出高度的控制,以達(dá)到更好的頁面顯示效果。