在CSS中,經常會出現多行文本需要進行省略號展示的情況,這時候我們可以使用text-overflow屬性進行處理。該屬性有3種取值:
text-overflow:clip; /*文字不進行省略,超出部分被裁剪*/ text-overflow:ellipsis; /*文字超出部分用省略號代替*/ text-overflow:inherit; /*繼承父元素的text-overflow屬性*/
對于省略號展示的實現,我們還需要用到white-space和overflow屬性。其中,white-space屬性可以控制元素內空白的處理方式,而overflow屬性可以控制元素溢出內容的處理方式。我們可以將white-space設置為nowrap,將overflow設置為hidden,這樣就能夠實現多行文本的省略號展示了。
.overflow-ellipsis { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
使用以上代碼將文本展現在一個固定寬度的容器中即可實現多行省略號效果。
上一篇mysql數據庫效率低
下一篇MySQL數據庫教學最牛