html - 如何设置链接长度的字符限制

Question

我有一个 RSS 提要框，其中显示了提要中的许多链接。框的大小是为 10 个链接指定的，每个链接在 1 行上。然而，有时当标题的长度很长时，链接会分成两行或更多行，它会使框变形。如何将限制字符设置为标题（链接）的长度？就像如果链接太长在链接末尾添加三个点：示例：如何设置字符限制...

这是我正在使用的提要：

<script language="JavaScript" src="http://rss.artaweb.biz//feed2js.php?src=http%3A%2F%2Fwww.bbc.co.uk%2Farabic%2Findex.xml&num=10&targ=y&utf=y"  charset="UTF-8" type="text/javascript"></script>

在此先感谢您的帮助。

Answer 1

首先在您的 div 中放置一个 id 或类，您将在其中放置或显示您的 rss 提要，例如

<div id="some-id">
   // your rss feed script
</div>

然后您可以使用此 jquery 脚本来限制文本显示为特定字符

$("div#some-id").text(function(index, text) {
   return text.substr(0, characters you want);
});

Answer 2

你使用 CSS 来：

1. 不允许换行
2. 为溢出的文本添加省略号

因此，例如，如果您将脚本包装在div带有 id 的链接中：

#links li {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

在 fidde 中演示：http: //jsfiddle.net/V9PXL/。尝试调整窗口大小，看看会发生什么。