「text-overflow: ellipsis」不起作用
嘗試使用「text-overflow: ellipsis」截斷< 中的文字時;跨距>元素,當視窗尺寸減小時,省略號不會出現。
解決方案
要啟用「text-overflow: ellipsis」功能,需要包含除了「text-overflow」之外,還包含以下CSS 屬性:
範例程式碼
解釋
在提供的範例中,元素的寬度為100px,overflow 屬性設定為“hidden”,確保任何多餘的內容都隱藏在元素的邊界內。顯示屬性設定為“block”以強制元素佔據矩形空間區塊。最後,將空白屬性設為「nowrap」以防止文字內換行。
應用這些屬性後,「text-overflow: ellipsis」屬性將發揮作用,截斷< 內的文字;跨度>元素並在視窗大小減小到文字超出元素寬度的程度時添加省略號(. ..)。
以上是為什麼「text-overflow: ellipsis」不適用於我的 Span 元素?的詳細內容。更多資訊請關注PHP中文網其他相關文章!