CSS设置多余的文本显示省略号

在web开发过程中，常常会遇到要让布局中的某些文本根据宽度来显示，如果超过最大宽度仍然显示不完的，就显示为省略号的情况，添加下面的CSS样式表就能实现这种效果，但是这种效果只适用于单行显示的文本。

首先给用于放文本的标签元素设置一个宽度值，并设置溢出属性overflow为溢出隐藏。

width: 245px;(此处宽度为举例)

overflow: hidden;

设置文本缩略的样式为"..."

white-space: nowrap;

text-overflow: ellipsis;