css固定宽度超出文字自动省略号显示

方案一：

代码如下：

text-overflow : ellipsis;

text-overflow:ellipsis;

white-space : nowrap;

overflow : hidden;

除了固定div或者其他容器宽度以外

要显示为点点，以上3个缺一不可；

还有，除了firefox,opera其他浏览器都支持，包括可恶的ie6

方案二：

下文为转摘

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.

关于.xml文件可自行百度搜索。