HTML中，一个表格，要达到二个条件：

1、内容多了不自动换行；

2、固定单元格宽度。如果内容超出，则隐藏；

如果在IE下，只是写成<tablestyle="table-layout:fixed;overflow:hidden;"><tr><tdnowrap>则可，而在FF下则不行。兼容IE和FF的写法，应该为：<tablestyle="table-layout:fixed;"><tr>tdstyle="overflow:hidden;"nowrap>

3、显示省略标记，只支持IE：

text-overflow:ellipsis;

测试代码：

<style>.tbl{table-layout:fixed}.td{overflow:hidden;text-overflow:ellipsis}</style>

<tableclass="tbl"border=1width=80>

<tr>

<tdwidth=25%class="td"nowrap>abcdefghigklmnopqrstuvwxyz1234567890</td>

<tdclass="td"nowrap><div>abcdefghigklmnopqrstuvwxyz1234567890</div></td>

</tr>

</table>

table设置超出部分隐藏，鼠标移上去显示全部内容

核心代码

table{

border-collapse:collapse;

width:55em;

table-layout:fixed;/*只有定义了表格的布局算法为fixed，下面td的定义才能起作用。*/

}

.theadth{

width:63px;

height:25px;

text-align:center;

}

tabletd{

position:relative;

/*width:80px;*/

height:25px;

text-align:center;

font-size:12px;

font-weight:normal;

width:100%;

word-break:keep-all;/*不换行*/

white-space:nowrap;/*不换行*/

overflow:hidden;/*内容超出宽度时隐藏超出部分的内容*/

text-overflow:ellipsis;/*当对象内文本溢出时显示省略标记(...)；需与overflow:hidden;一起使用。*/

}

tabletd:hover{

overflow:visible;/*鼠标放上去显示全部文字*/

}

比较适合单独的页面，去过是全站模板就不能这么用了

table表格溢出隐藏

CSS部分：

table{

table-layout:fixed;

width:100%;

height:100%;

border-collapse:collapse;

}

tabletd{

border:1pxsolid#5a5858;

overflow:hidden;

text-overflow:ellipsis;

white-space:nowrap;

}

.box{

width:400px;

height:200px;

}

HTML部分：

<divclass="box">

<table>

<tr>

<td>1111</td>

<td>5555555555555555555456464645646464646</td>

</tr>

</table>

</div>