如何使用 CSS 截断文本

html-css023

如何使用 CSS 截断文本,第1张

text-overflow语法:

text-overflow : clip | ellipsis

text-overflow参数值和解释:

clip :  不显示省略标记(...),而是简单的裁切

ellipsis :  当对象内文本溢出时显示省略标记(...)

text-overflow应用说明:

CSS text-overflow设置或检索是否使用一个省略号标记(...)标示对象内文本文字的溢出。

要想实现显示不完内容将显示省略号代替,还需要html nobr标签完成(nobr禁止换行标签)

word-break:keep-all white-space:nowrap overflow:hidden text-overflow:ellipsis

加上这几个样式就行,记得设置宽度,百分比宽度也可以,只要给宽度就行。