CSS - 最大宽度和椭圆

Question

我有一个包含文字的跨度.我希望跨度扩展到最大500px以容纳内部文本.达到最大值后,我希望文本显示任何溢出最大宽度的文本的省略号.这可能吗？我尝试了以下方法,但这并没有成功.

谢谢

{
    position: absolute;
    top: 13px;
    left: 44px;
    max-width: 500px;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}

Answer 1

这对我有用

display: inline-block; // This is what you're missing
max-width: 300px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;

display: inline-block; // This is what you're missing
max-width: 300px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;

.elipsis {
    max-width: 300px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block;
}

Answer 2

此 JavaScript 将截断您的文本并添加省略号。（不要在单词或标记中间中断它）

Barelyfitz 截断 js。

不确定 i 的浏览器兼容性，但它应该可以工作:)

希望能帮助到你。