通常的做法是這樣的：

1.overflow:hidden;

2.text-overflow:ellipsis;

3.-o-text-overflow:ellipsis;

4.white-space:nowrap;

5.width:100%;

程式碼如下：

.li{overflow:hidden;text-overflow:ellipsis;-o-text-overflow:ellipsis;white-space:nowrap;width:100%;}

white-space：nowrap;表示文字不會換行，在同一行繼續，知道遇到

標籤為止；

overflow：hidden;不顯示超過物件尺寸的內容，就是把超出的部分隱藏了；

text-overflow：ellipsis;當文字物件溢位是顯示...，當然也可是設定屬性為clip不顯示點點點；

-o-text-overflow:ellipsis針對opera；而寬度的設定主要是針對ie6；

該方法支援internetexplorer,safari,chrome和opera，但ff並不支援，不過可以透過jquery來實現類似的效果。

下載這個jquery外掛：jqueryellipsisplugin

呼叫方法：

1.$(document).ready(function(){

2.$(".ellipsis").ellipsis();

3.}