javascript - 如何将标签转换为“…”

我有一个链接列表。

将分别显示以下内容。文字较大时。链接分为两行。

我不要文本换行。

喜欢 ：

<a href="javascript:void(0)" > Link within two lines </a>

Link within
two lines

转换成 ：

<a href="javascript:void(0)" > Link within two lines </a>

Link within ...

可能吗？

我不知道

最佳答案

您在这里描述的是text-overflow:ellipsis;溢出属性。

现在，每当换行时，这意味着文本不再适合第一行。但是，我们不需要第二行，因此我们使用white-space: nowrap;。

为了确定溢出，我们在块显示中使用overflow: hidden;，以便为锚点提供自定义宽度。在这种情况下，display: inline-block;就像我想要的那样。当我们溢出width: 90px;时，我们给出自定义宽度的位置。
 这样我们得到：

a
{
    width: 90px;
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

90px内的文本没有标签。

jsFiddle