系统提示：这是一个从旧版社区导入的帖子。
如果显示不正常，或需要查找旧帖中上传的附件，请参照原帖。
原帖地址：http://my.iecn.net/bbs/view/106743.html
如非必要，请不要修改此帖！如果修改，请保留以上信息。

我在CSS里面设置了如下属性，但是运用起来不对，css里面text-overflow : ellipsis; 底下老是有个红线，应该是错误提示吧！
text-overflow 这个css选项里面没有,我是看css文件里有这种属性!

我的要求是：表格是160的宽，12号的字，18象素行高，只需要两行，然后文章自动截取出现“…”

红线部分是想要的结果,就是当一篇文章多时,它会自动截取(当然那个部分是动态的,该css里写还是程序里写)

但是底下这个不起作用，不知道是哪里出错！

.high{

color:#737373;

font-size:12px;

font-family: Arial, Helvetica, sans-serif;

line-height: 18px;

text-decoration: none;

height: 30px;

width: 160px;

overflow : hidden;

white-space : normal;

text-overflow : ellipsis;

}

谢谢大家!

兼容非IE浏览器的text-overflow : ellipsis;可以看这个篇：
http://www.hedgerwow.com/360/dhtml/text_overflow/demo.php
上面的DEMO结合了JS来控制，实例应用中用到的moz-text-overflow.js，代码如下：

JavaScript 代码：
function initMozTextOverflow(obj) { function re_render() { doMozTextOverflow(obj); } setTimeout(re_render,0); } function doMozTextOverflow(obj) { function _overflow(e) { var el = e.currentTarget; el.className="_textOverflow"; } function _underflow(e) { var el = e.currentTarget; el.className="_textUnderflow"; } obj.className="_textUnderflow"; obj.addEventListener("overflow", _overflow, false); obj.addEventListener("underflow", _underflow, false); obj.ins = document.createElement("ins"); obj.ins.innerHTML="&hellip;"; obj.appendChild(obj.ins); obj.onmousedown = function(e) { this.selectStartX = e.clientX - document.getBoxObjectFor(this).x; } obj.onmouseup = function(e) { this.selectStartX = null; } obj.onmousemove = function(e) { if(this.selectStartX!=null ) { var mx = e.clientX - this.selectStartX; var ex = this.offsetWidth - this.selectStartX; if( ( ex - mx) < (this.ins.offsetWidth+3) ) { if(this.className!="_textUnderflow") { this.className="_textUnderflow"; this.scrollLeft=0; var box = document.createElement("input"); box.setAttribute("type","text"); box.value=1111 this.appendChild(box); box.select(); this.removeChild(box); this.focus(); } } else { if(this.className!="_textOverflow") { this.className="_textOverflow" } } return false; } };}

系统提示：这是一个从旧版导入的帖子，如有问题请参照原帖（原帖地址见顶楼）。

最好是用后台程序去截断一下字符串长度，再加上...

text-overflow : ellipsis;只是IE6特有的属性，并且效果并不理想。它需要结合white-space:nowrap;才能生效，而white-space:nowrap;限制了只能显示一行文字。

HTML 代码：
<style type="text/css" media="all">.IECN {height:120px;width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}</style><div class="IECN">专注Web技术，体验开发乐趣！</div>

</div>


兼容非IE浏览器的text-overflow : ellipsis;可以看这个篇：
http://www.hedgerwow.com/360/dhtml/text_overflow/demo.php
上面的DEMO结合了JS来控制，实例应用中用到的moz-text-overflow.js，代码如下：

JavaScript 代码：
function initMozTextOverflow(obj) { function re_render() { doMozTextOverflow(obj); } setTimeout(re_render,0); } function doMozTextOverflow(obj) { function _overflow(e) { var el = e.currentTarget; el.className="_textOverflow"; } function _underflow(e) { var el = e.currentTarget; el.className="_textUnderflow"; } obj.className="_textUnderflow"; obj.addEventListener("overflow", _overflow, false); obj.addEventListener("underflow", _underflow, false); obj.ins = document.createElement("ins"); obj.ins.innerHTML="&hellip;"; obj.appendChild(obj.ins); obj.onmousedown = function(e) { this.selectStartX = e.clientX - document.getBoxObjectFor(this).x; } obj.onmouseup = function(e) { this.selectStartX = null; } obj.onmousemove = function(e) { if(this.selectStartX!=null ) { var mx = e.clientX - this.selectStartX; var ex = this.offsetWidth - this.selectStartX; if( ( ex - mx) < (this.ins.offsetWidth+3) ) { if(this.className!="_textUnderflow") { this.className="_textUnderflow"; this.scrollLeft=0; var box = document.createElement("input"); box.setAttribute("type","text"); box.value=1111 this.appendChild(box); box.select(); this.removeChild(box); this.focus(); } } else { if(this.className!="_textOverflow") { this.className="_textOverflow" } } return false; } };}

系统提示：这是一个从旧版导入的帖子，如有问题请参照原帖（原帖地址见顶楼）。