返回列表 回复 发帖

用CSS实现超长字段被省略的简单方法

  1. <table width="550" border="0" cellpadding="5" cellspacing="1" bgcolor="#007373" style="table-layout:fixed">
  2. <tr>
  3. <th nowrap bgcolor="#159AA2" style="overflow:hidden; text-overflow:ellipsis; color:#FFFFFF;">List1</th>
  4. <th nowrap bgcolor="#159AA2" style="overflow:hidden; text-overflow:ellipsis; color:#FFFFFF;">List2</th>
  5. <th nowrap bgcolor="#159AA2" style="overflow:hidden; text-overflow:ellipsis; color:#FFFFFF;">List3</th>
  6. </tr>
  7. <tr>
  8. <td nowrap bgcolor="#E8FFFF" style="overflow:hidden; text-overflow:ellipsis;">用CSS实现超长字段被省略的简单方法</td>
  9. <td nowrap bgcolor="#E8FFFF" style="overflow:hidden; text-overflow:ellipsis;">用CSS实现超长字段被省略的简单方法</td>
  10. <td nowrap bgcolor="#E8FFFF" style="overflow:hidden; text-overflow:ellipsis;">用CSS实现超长字段被省略的简单方法</td>
  11. </tr>
  12. </table>
复制代码
怨去吹箫,狂来说剑,两样销魂味。

谢谢

谢谢发布这些知识,我正在学习这门语言,对我有很大帮助!

注意的几点

(1)style="table-layout:fixed" 其作用是让表格固定大小显示,如果省略了此句代码,超出单元格的字符将不会被省略.7 Y. y% y# t$ f
(2)text-overflow:ellipsis  显示效果是超长字符被省略的部分将以省略号(..)代替;4 }' g5 v( p& Z
   text-overflow:clip     其显示效果为超长字段省略后,后面没有省略号(..)
呵~谢谢提醒~
怨去吹箫,狂来说剑,两样销魂味。
返回列表