CSS單行文本超出隱藏是指當一行文本長度超過了容器的寬度時,超出部分被隱藏,只展示容器寬度內的部分。實現該效果需要用到CSS的white-space和text-overflow屬性。
p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
在上面的代碼中,white-space屬性設置為nowrap,即強制不換行,使文本始終只占據一行。overflow屬性設置為hidden,當文本長度超過容器寬度時,被隱藏。text-overflow屬性設置為ellipsis,表示當顯示的文本被截斷時,使用省略號(...)表示被隱藏的部分。
需要注意的是,該效果只對單行文本起作用,如果文本內容多于一行,依然會換行顯示。
上一篇css單獨設置數字字體
下一篇css單行文字折疊