多浏览器下，CSS截断功能。
在多浏览器下，往往采用CSS截断，在IE浏览器中可实现，但是在Firefox，Chrome下，往往不能实现截断处理，导致FF下，显示半个字符样式。为解决此问题，查询好久
终于在坛子中找到一个好的方式。
现特将其引用，整理分享给有此类需求的朋友。
Demo：
1）页面文字如下:
<header>
<title>CSS截断处理演示Demo</title>
<link href="Css/style.css" type="text/css" rel="stylesheet">
</header>
<body>
<div class="PanelDiv">
<ul>
<li><a>美国大选共和党预选启动 摩门教亿万富豪罗姆尼领跑.</a></li>
<li><a> 经验丰富的设计师知道一些其他人不知道的东西，这些东西是什么呢？</a></li>
<li><a>介绍了架构和架构师的理解以及软件开发的过程，相对于原则和模式我们更加强调了开发的过程</a></li>
<li><a>美国大选共和党预选启动 摩门教亿万富豪罗姆尼领跑.</a></li>
<li><a> 经验丰富的设计师知道一些其他人不知道的东西，这些东西是什么呢？</a></li>
<li><a>介绍了架构和架构师的理解以及软件开发的过程，相对于原则和模式我们更加强调了开发的过程</a></li>
<li><a>美国大选共和党预选启动 摩门教亿万富豪罗姆尼领跑.</a></li>
<li><a> 经验丰富的设计师知道一些其他人不知道的东西，这些东西是什么呢？</a></li>
<li><a>介绍了架构和架构师的理解以及软件开发的过程，相对于原则和模式我们更加强调了开发的过程</a></li>
</ul>
</div>
</body>
2) style.css样式如下
.PanelDiv{ width:400px; height:300px;}
.PanelDiv ul li{ width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration: none;}
.PanelDiv ul li a:link, .PanelDiv ul li a:hover, .PanelDiv ul li a:visited{
-o-text-overflow:ellipsis;
-icab-text-overflow:ellipsis;
-khtml-text-overflow:ellipsis;
-moz-text-overflow: ellipsis;
-webkit-text-overflow: ellipsis;
-moz-binding: url('ellipsis.xml#ellipsis');
}
3)style.css同级目录下，需要有ellipsis.xml文件，内容如下：
<?xml version="1.0"?>
<bindings
xmlns="http://www.mozilla.org/xbl"
xmlns:xbl="http://www.mozilla.org/xbl"
xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<binding id="ellipsis">
<content>
<xul:description crop="end" xbl:inherits="value=xbl:text"><children/></xul:description>
</content>
</binding>
</bindings>
OK,一切就这样轻松搞定了，至于内在深入原理，还没有搞明白，不太擅长CSS特殊处理功能。
其实，页面内容如果输出很多，采用页面截断方式，会导致网络传输大。还是推荐采用输出内容时，代码截断。在现有CPU处理能力下，对于字符截断的处理，对于性能的损耗微乎其微。当然，如果是数据直接从库中读取，绑定页面模板，这是个值得推荐的方式。后台代码处理截断字符，也可考虑采用客户端脚本处理，毕竟现在很多对于数据读取，都是采用异步读取，返回JSon字符传，可以考虑将Json返回值绑定时，采取一步操作，再从页面显示。
