包装和删除多余的字符

Question

是否有一种方法可以去除无法装入元素内的无法打包的字符。

对于示例 -

，如果有具体的清单宽度 -

<ul> 
    <li>First word</li> 
    <li>This is a long long long word</li> 
    <li>Another word</li> 
</ul> 

这种风格 - 大

ul li 
{ 
    width:100px; 
    height:20px; 
    border:1px solid black; 
} 

然后，长项文本将被包装成第二线。

如何删除多余的无法打包的文字/字符？

这里是小提琴：http://jsfiddle.net/N9ct3/1/

编辑：有可通过计算characters-可能不是一个解决方案&也可行的IE8是多个列表项具有不同的宽度 - 因此，子+

Answer 1

通过添加文本省略号的为例：http://jsfiddle.net/N9ct3/2/

ul li 
{ 
    width:100px; 
    height:20px; 
    background-color:lightblue; 
    border:1px solid black; 

    //Avoid text overflow by adding "..." 
    text-overflow: ellipsis; 
    white-space: nowrap; 
    overflow: hidden; 
} 

Answer 2

您可以将css规则overflow: hidden;添加到列表项中。

ul li 
{ 
    width:100px; 
    height:20px; 
    overflow: hidden; 
    background-color:lightblue; 
    border:1px solid black; 
}