CSS解決中英文混合字符串的截取省略問題

隨着W3C的漸漸普及，許多網站都在進行着將傳統表格轉化爲DIV+CSS的佈局方式，我在研究CSS與DIV的一些特性時，發現了一個比較有趣的CSS，經過一系列的研究和實驗以後，發現了一個使用DIV+CSS實現這一功能的另類方法，此方法在我所能測試均無問題，並且良好的兼容於各種編碼及中英文混排的情況。
在Div中的方法：

<DIV STYLE="width: 200px; border: 1px dashed red; overflow: hidden; text-overflow:ellipsis">
<NOBR>就是比如有一行文字，很長，表格內一行顯示不下.</NOBR>
<NOBR>就a是比如有一行文字，很長，表格內一行顯示不下.</NOBR>
<NOBR>就1是比如有一行文字，很長，表格內一行顯示不下.</NOBR>
<NOBR>就F是比如有一行文字，很長，表格內一行顯示不下.</NOBR>
<NOBR>就是 Like You Pig Very Very Very Much.</NOBR>
</DIV>
在Table中的方法：
<TABLE style="table-layout:fixed;border-collapse:collapse;font-size:12px;" border="1" width="200" bordercolor=#666666>
<TR>
<TD nowrap style="overflow:hidden;text-overflow:ellipsis;">內容內容內容內容內容內容內容內容內容內容內容內容內容內容內容內容內容內容內容內容內容內容</TD>
</TR>
</TABLE>
代碼很簡單，基本上應該很容易就可以看明白，主要在於“text-overflow”這個屬性，此屬性有2個值，分別是“ellipsis”和“clip”，簡單的理解，第一個值會在截取之後在文字末端加上省略號，第二個值則不會。

轉自[url]http://yardan.blog.51cto.com/304821/83018[/url]