CSS非常重要,它使網站看起來更美觀,更專業。本文主要介紹如何實現在不換行的情況下隱藏文本。
.hide-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
上述代碼是實現不換行隱藏的核心內容。其中,overflow: hidden;
用于隱藏超出容器范圍的文本;text-overflow: ellipsis;
用于在隱藏的文本后添加省略號;white-space: nowrap;
則是不允許換行。
下面是一個例子,展示如何在HTML中使用這段CSS代碼:
<p class="hide-text">這是一段很長的文本,需要被隱藏而且不能換行。</p>
通過以上代碼的實現,可以讓文本超出容器范圍時被省略,而不會影響布局的整潔。
上一篇css 不重復位置居中
下一篇css 不繼承寬度