如果文本在其容器內的單行溢出,我想顯示省略號。是否有我必須申請的CSS屬性?在文本溢出的情況下顯示三個點(省略號)
-1
A
回答
4
應用下面的CSS3屬性
text-overflow: ellipsis;
1
應用下面的類來要截斷並添加省略號的文字。
.truncate {
width: 250px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
http://css-tricks.com/snippets/css/truncate-string-with-ellipsis/
3
嘗試此你的元素: text-overflow: ellipsis;
您還可以申報overflow: hidden;
,使瀏覽器知道你的文字的尺寸限制在容器大小(並在其後開始文本溢出行爲)。
1
div {
text-overflow: ellipsis;
}
這裏DEMO
http://www.w3schools.com/cssref/tryit.asp?filename=trycss3_text-overflow
相關問題
- 1. 三點 - 溢出:省略號
- 2. 文本溢出省略號
- 3. 文本溢出省略號
- 4. 文本溢出省略號在我的情況下不起作用
- 5. 左側的文本溢出省略號
- 6. CSS文本溢出省略號顯示不正確
- 7. 結合文本溢出:省略號與顯示:flex
- 8. CSS文本溢出省略號不顯示
- 9. 文本溢出:省略號不起作用顯示行有限
- 10. CSS文本溢出省略號懸停並在彈出框中顯示文本
- 11. 文本溢出省略號不工作
- 12. 獲取文本溢出:省略號後
- 13. CSS文本溢出前置省略號
- 14. CSS覆蓋文本溢出:省略號
- 15. HTML畫布文本溢出省略號
- 16. CSS - 文本溢出:省略號修復
- 17. 文本溢出問題:省略號
- 18. 文本溢出省略號與表
- 19. 下拉框中的溢出文本的省略號
- 20. 問題與溢出:隱藏和文本溢出:省略號
- 21. 如何使溢出的TextArea截斷文本並在最後顯示省略號?
- 22. 使用文本溢出:省略號;只有在一個div
- 23. 文本溢出:省略號跳到Android上的文本後面
- 24. text-overflow:ellipsis;不截斷溢出的文本,並給出省略號
- 25. 文本溢出省略號與幾個跨度
- 26. 文本溢出省略號可以指向一個元素嗎?
- 27. 3列顯示:具有溢出的彈性佈局:省略號
- 28. 顯示2個文本同一行與文本的省略號
- 29. 截取文本溢出的多行文字:省略號
- 30. 在文本溢出省略號後面放置圖標