如果不想由于单行文本过长而影响布局,通常会截取文本的一部分进行显示,并且在其末尾显示省略号。
要实现文本截断的效果,可配合使用white-space、overflow与text-overflow属性,具体样式代码如下所示。
width: 135px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;
-moz-text-overflow: ellipsis;
-webkit-text-overflow: ellipsis;