页面：
<ul> <li>· 测试测试测试测试测试测试</li> <li>· 测试测试测试测试测试测试</li> <li>· 测试测试测试测试测试测试</li> <li>· 测试测试测试测试测试测试</li> <li>· 测试测试测试测试测试测试</li> </ul>
css：
li{ line-height: 22px; font-size: 12px; border-bottom: 1px solid #ccc; width: 120px; /* 设置宽度 */ overflow: hidden;/* 溢出内容设为隐藏 */ white-space:nowrap ;/* 强制文本单行显示 */ text-overflow:ellipsis;/* 设置溢出文本显示为省略标记 */ }
效果：
说明：在上述例子中仅设置text-overflow属性是不够的。必须设置文本外围的宽度、溢出内容为隐藏（overflow:hidden）、强制文本单行显示（white-space:nowrap）,这样设置的text-overflow属性值ellipsis才能显示省略标记的效果。
原文：http://www.cnblogs.com/wangxufeng/p/4622065.html