如何让 css 在文本溢出时生成省略号？

【问题标题】：How can I make css generate an ellipsis on text overflow?如何让 css 在文本溢出时生成省略号？
【发布时间】：2014-02-03 18:15:20
【问题描述】：

我正在处理这个jsfiddle。我希望 <p>Super long words here</p> 看起来像 Super lon... 而不是显示全文。我尝试添加

white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;

但它没有用。如何让我的溢出文本以省略号结尾？

【问题讨论】：

【解决方案1】：

你必须指定一个宽度来达到这个效果，像这样：

.pClass p {
    margin: 0 !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width:20px;
}

【讨论】：