CSS中可以用text-overflow屬性實(shí)現(xiàn)文字超過容器大小時(shí)的省略號(hào)顯示,即"..."。在實(shí)現(xiàn)過程中,需要設(shè)置以下三個(gè)樣式:
overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
上述代碼中overflow:hidden表示超出容器的部分將被隱藏,white-space:nowrap表示文本不可換行,text-overflow:ellipsis表示超出容器的文本用省略號(hào)顯示。
需要注意的是,該屬性只適用于單行文本,如果想要多行文本使用省略號(hào)顯示,需要借助JavaScript的幫助,并且需要根據(jù)實(shí)際情況進(jìn)行調(diào)整。
此外,為了保證效果最佳,容器必須要有一個(gè)固定的寬度或者是最大寬度,否則省略號(hào)的顯示可能會(huì)出現(xiàn)問題。