溢出文本显示为省略号的效果及其text-overflow:ellipsis;的使用

语法： 
text-overflow : clip | ellipsis 
参数： 
clip : 　不显示省略标记（...），而是简单的裁切 
ellipsis : 　当对象内文本溢出时显示省略标记（...） 
说明： 
设置或检索是否使用一个省略标记（...）标示对象内文本的溢出。 
text-overflow:ellipsis属性在FF中是没有效果的。
示例： 
div { text-overflow : clip; } 
  
想要实现溢出时产生省略号的效果必须定义：强制文本在一行内显示（white-space:nowrap）及溢出内容为隐藏（overflow:hidden）。只有这样才能实现溢出文本显示省略号的效果。
结论：只要在css样式中同时使用： text-overflow:ellipsis; white-space:nowrap; overflow:hidden; 即可实现溢出文本显示为省略号的效果。
使用text-overflow:ellipsis对溢出文本显示省略号有两个好处，一是不用通过程序限定字数；二是有利于SEO。需要使用对对溢出文本显示省略号的通常是文章标题列表，这样处理对搜索引擎更友好，因为标题实际上并未被截字，而是局限于宽度而未被显示而已。

通常的做法是这样的：
1.overflow:hidden;
2.text-overflow:ellipsis;
3.-o-text-overflow:ellipsis;
4.white-space:nowrap;
5.width:100%;

其中，overflow: hidden和white-space: nowrap都是必须的否则不会显示省略号；-o-text-overflow: ellipsis针对Opera；而宽度的设定主要是针对IE6；
该方法支持Internet Explorer, Safari, Chrome 和 Opera，但FF并不支持，不过可以通过Jquery来实现类似的效果。
下载这个Jquery插件：jQuery ellipsis plugin
调用方法：
$(document).ready(function() {
  $('.ellipsis').ellipsis();
}