html代码:

<div class="news">
   <div class="newsTitle"><a href="#">关于认真学习贯彻党的十七届五中全会精神深入推进创先争优活动的通知关于认真学习贯彻党的十七届五中全会精神深入推进创先争优活动的通知</a></div>
   <div class="date">2011-11-02</div>
</div>

Css代码:

.news
{
 background:url(../images/underline.jpg) no-repeat bottom;
 width:705px;
 height:35px;
 line-height:35px;
}
.newsTitle
{
 line-height:35px;
 float:left;
 width:580px;
 white-space:nowrap;
 text-overflow:ellipsis;
 -o-text-overflow:ellipsis;

-moz-binding:url('ellipsis.xml#ellipsis'); 
 overflow:hidden;
 background:url(../images/li.jpg) no-repeat bottom left;
 padding-left:20px;
}
.newsTitle a
{
 color:black;
}
.date
{
 width:105px;
 float:left;
 text-align:right;
 line-height:35px;
}

css代码中,红色的部分就是用来实现文字溢出。

white-space:nowrap;表示文字不换行。

text-overflow:ellipsis; 兼容IE,Safari.

-o-text-overflow:ellipsis;兼容opera;

-moz-binding:url('ellipsis.xml#ellipsis'); 兼容firefox.

elipsis.xml下载地址