如何使用CSS仅显示字符串的一部分

我希望能够显示最多 10 个字符的字符串。如果字符串超过 10 个字符，我想在末尾附加“...”。

例如，如果我有字符串：

'helloworldmynameisryan'

我希望它像这样显示：

'helloworld...'

我只是在 div 中显示我的字符串，如下所示：

<div>DisplayMessage</div>

我是否可以创建一个仅适用于字符串超过 10 个字符的类？

不幸的是，没有一种好的跨浏览器方法可以仅使用 CSS 来完成此操作。 “文本溢出”依赖于字符串的宽度，而不是您需要的字符串的长度。

您可以使用 javascript 中字符串的 .length 属性来实现此目的

function ellipsify (str) {
    if (str.length > 10) {
        return (str.substring(0, 10) + "...");
    }
    else {
        return str;
    }
}

希望这可以帮助。