使用overflow:hidden防止文本溢出其尺寸。
使用white-space:nowrap防止文本高度超过一行。
使用text-overflow:ellipsis防止如果文本超出其尺寸,它将以省略号结尾。
为元素指定一个固定width值以知道何时显示省略号。
仅适用于单行元素。
预览效果如下所示:
HTML
pclass="truncate-text"如果我超过一条线的宽度,我将被截断。/p
CSS
.truncate-text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:px;}
今天就讲到这里,如果有问题需要咨询,大家可以直接留言或扫下方