修复列表项的宽度并隐藏溢出的文本

Question

我有一个包含单个项目的列表，我想将列表项的宽度修改为200px，如果文本链接超出200px的宽度，则将文本链接截断为“...”。

我有什么想法可以这样做吗？

<ul>
  <li>
    <a href="account.asp">Super long string</a>
  </li>
</ul>

Answer 1

ul li {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 200px;
}

Answer 2

使用此css：

ul li {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 200px;
}

这种css风格是关键：

text-overflow: ellipsis;

在此播放：http://www.w3schools.com/cssref/tryit.asp?filename=trycss3_text-overflow

在这里测试：http://jsfiddle.net/xXM2z/