CSS2中,我們可以使用text-overflow
屬性來限制文本內容在特定寬度內的顯示,超出部分可以選擇隱藏。
.text { width: 100px; white-space: nowrap; /* 防止換行 */ overflow: hidden; text-overflow: ellipsis; /* 超出部分顯示省略號 */ }
上面的代碼示例將元素的寬度設置為 100px,超出部分被隱藏。而text-overflow: ellipsis
屬性則會在文本內容超出時顯示省略號來代替被隱藏的部分。
在實際應用中,這種效果常常用于顯示標題或者短文本內容,可以使頁面更加美觀。
需要注意的是,text-overflow
屬性僅在以下條件下生效:
white-space
屬性必須為nowrap
,防止出現換行情況overflow
屬性必須為hidden
或者scroll
- 必須有指定寬度,否則
text-overflow
不會生效
以上是有關 CSS2 行超出隱藏的介紹,希望能夠幫助大家更好地使用 CSS2 來布局頁面。
上一篇mysql取前兩位排序
下一篇css3拖動圓點控制方向