81,091
社区成员
发帖
与我相关
我的任务
分享css控制表格表头固定，rowspan出现问题
本人最近做表格的固定表头时发现，如果表格的表头具有多行，用到rowspan时， rowspan的效果总是被底下的tr遮盖，不知哪位达人遇到过这种情况没， 底下是完整的代码，英雄们试一下，看一下效果，给解决一下rowspan出现的问题。 谢过！！
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title></title>
<style>
.fixedHeaderTr
{
z-index:10;
position:relative;
top:expression(this.parentNode.parentNode.parentNode.scrollTop);
};
.mainDiv
{
overflow:auto;
scrollbar-face-color:9999ff;
height:200px;
width:600px;
}
</style>
</head>
<body>
<div class="mainDiv" id=mailContainerDiv>
<table border=1 cellspacing=0 cellpadding=0 bordercolor="#0000FF" width=800px>
<thead>
<tr class="fixedHeaderTr" bgcolor="#EF380F">
<th rowspan=2>qrwewer</th>
<th colspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
</tr>
<tr class="fixedHeaderTr" bgcolor="#00FF00" >
<th>rewwer</th>
<th>werewr</th>
</tr>
</thead>
<tbody>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
...全文
请发表友善的回复…
发表回复
yych1996 2010-07-29
- 打赏
- 举报
在第二个你要固定的tr处加上style="background-color:Transparent;"
hoojo 2010-01-28
- 打赏
- 举报
你用一行，然后在里面再嵌套一个表格。用css控制宽度和下面的单元格宽度一致就可以了。
<div class="mainDiv" id=mailContainerDiv>
<table border=1 cellspacing=0 cellpadding=0 bordercolor="#0000FF" width=800px>
<thead>
<tr bgcolor="#EF380F" class="fixedHeaderTr">
<th colspan=11 >
<table width="100%" border=1 cellspacing=0 cellpadding=0 bordercolor="#0000FF">
<tr bgcolor="#EF380F">
<th rowspan=2 width="70">qrwewer</th>
<th colspan=2 width="100">werwer</th>
<th rowspan=2 width="70">werwer</th>
<th rowspan=2 width="70">werwer</th>
<th rowspan=2 width="70">werwer</th>
<th rowspan=2 width="70">werwer</th>
<th rowspan=2 width="70">werwer</th>
<th rowspan=2 width="70">werwer</th>
<th rowspan=2 width="70">werwer</th>
<th rowspan=2 width="70">werwer</th>
</tr>
<tr bgcolor="#00FF00">
<th width="50">rewwer</th>
<th width="50">werewr</th>
</tr>
</table>
</th>
</tr>
</thead>
<tbody>
<tr>
<td width="70">rewwerdddddddd</td>
<td width="50">werewrdddddddddd</td>
<td width="50">rewweddddddr</td>
<td width="70">werddddddddddewr</td>
<td width="70">rewdddddddddwer</td>
<td width="70">werdddddddddewr</td>
<td width="70">reddddddddddwwer</td>
<td width="70">werddddddewr</td>
<td width="70">rewdddddddddwer</td>
<td width="70">werdddddddddddewr</td>
<td width="70">rewdddddrewr</td>
</tr>
qustgjk 2010-01-28
- 打赏
- 举报
[Quote=引用 13 楼 ibm_hoojo 的回复:]
HTML code
弄了2个小时，也没有办法解决。最后想来一个很笨的方法。不过还是要辛苦楼主自己把单元格的宽度，都用
CSS控制一下。应该就没有什么大问题的。
LZ的问题就在这里了<trclass="fixedHeaderTr" bgcolor="#EF380F"><throwspan=2>qrwewer</th><thcolspan=2>werwer</th><throwspan=2>werw?-
[/Quote]
我这里必须用到跨行和跨列啊，你是让我表头用一行吧，为难我了！！
HTML code
弄了2个小时，也没有办法解决。最后想来一个很笨的方法。不过还是要辛苦楼主自己把单元格的宽度，都用
CSS控制一下。应该就没有什么大问题的。
LZ的问题就在这里了<trclass="fixedHeaderTr" bgcolor="#EF380F"><throwspan=2>qrwewer</th><thcolspan=2>werwer</th><throwspan=2>werw?-
[/Quote]
我这里必须用到跨行和跨列啊，你是让我表头用一行吧，为难我了！！
qustgjk 2010-01-28
- 打赏
- 举报
[Quote=引用 13 楼 ibm_hoojo 的回复:]
HTML code
弄了2个小时，也没有办法解决。最后想来一个很笨的方法。不过还是要辛苦楼主自己把单元格的宽度，都用
CSS控制一下。应该就没有什么大问题的。
LZ的问题就在这里了<trclass="fixedHeaderTr" bgcolor="#EF380F"><throwspan=2>qrwewer</th><thcolspan=2>werwer</th><throwspan=2>werw?-
[/Quote]
首先感谢你花时间为我解决问题， 但是你说的“所以只能用一行了，一行你可以在里面随意放些东西都是可以的。”的意思我没明白哦，嘿嘿
HTML code
弄了2个小时，也没有办法解决。最后想来一个很笨的方法。不过还是要辛苦楼主自己把单元格的宽度，都用
CSS控制一下。应该就没有什么大问题的。
LZ的问题就在这里了<trclass="fixedHeaderTr" bgcolor="#EF380F"><throwspan=2>qrwewer</th><thcolspan=2>werwer</th><throwspan=2>werw?-
[/Quote]
首先感谢你花时间为我解决问题， 但是你说的“所以只能用一行了，一行你可以在里面随意放些东西都是可以的。”的意思我没明白哦，嘿嘿
qustgjk 2010-01-28
- 打赏
- 举报
[Quote=引用 11 楼 lijinsheng009 的回复:]
<tr class="fixedHeaderTr" bgcolor="#EF380F">
<th rowspan=2>qrwewer </th>
<th colspan=2>werwer </th>
<th rowspan=2>werwer </th>
<th rowspan=2>werwer </th>
<th rowspan=2>werwer </th>
<th rowspan=2>werwer </th>
<th rowspan=2>werwer </th>
<th rowspan=2>werwer </th>
<th rowspan=2>werwer </th>
<th rowspan=2>werwer </th>
</tr>
<tr class="fixedHeaderTr" bgcolor="#00FF00" >
<th>rewwer </th>
<th>werewr </th>
</tr>
去掉 两个 class =“fixedHeaderTr” 就行 ，我试过了，可以，而且 跟你 想要的 需求 一样，是 可以 自动拉伸的，嘿嘿，多谢啊，学习哦，以前没有 遇到过 这样的问题，多谢了，嘿嘿
[/Quote]
你理解错了，去掉class后固定表头没效果了，而且我说的拉伸是用js根据鼠标指针来拉长或拉短表格的列，不是你说的自动拉伸，我的拉伸功能我这里没写
<tr class="fixedHeaderTr" bgcolor="#EF380F">
<th rowspan=2>qrwewer </th>
<th colspan=2>werwer </th>
<th rowspan=2>werwer </th>
<th rowspan=2>werwer </th>
<th rowspan=2>werwer </th>
<th rowspan=2>werwer </th>
<th rowspan=2>werwer </th>
<th rowspan=2>werwer </th>
<th rowspan=2>werwer </th>
<th rowspan=2>werwer </th>
</tr>
<tr class="fixedHeaderTr" bgcolor="#00FF00" >
<th>rewwer </th>
<th>werewr </th>
</tr>
去掉 两个 class =“fixedHeaderTr” 就行 ，我试过了，可以，而且 跟你 想要的 需求 一样，是 可以 自动拉伸的，嘿嘿，多谢啊，学习哦，以前没有 遇到过 这样的问题，多谢了，嘿嘿
[/Quote]
你理解错了，去掉class后固定表头没效果了，而且我说的拉伸是用js根据鼠标指针来拉长或拉短表格的列，不是你说的自动拉伸，我的拉伸功能我这里没写
hoojo 2010-01-28
- 打赏
- 举报
弄了2个小时，也没有办法解决。最后想来一个很笨的方法。不过还是要辛苦楼主自己把单元格的宽度，都用
CSS控制一下。应该就没有什么大问题的。
LZ的问题就在这里了
<tr class="fixedHeaderTr" bgcolor="#EF380F">
<th rowspan=2>qrwewer</th>
<th colspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
</tr>
<tr class="fixedHeaderTr" bgcolor="#00FF00" >
这样就分成了2个独立的行，由于position: relative;这2行就脱离了表格的常规布局。不再是以前的行，是可以随意飘动的。所以跨行的文字就只有一半了。所以只能用一行了，一行你可以在里面随意放些东西都是可以的。
hoojo 2010-01-28
- 打赏
- 举报
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title></title>
<style>
.fixedHeaderTr
{
z-index:10;
position: relative;
top:expression(this.parentNode.parentNode.parentNode.scrollTop);
};
.mainDiv
{
overflow:auto;
scrollbar-face-color:9999ff;
height:200px;
width:600px;
}
</style>
</head>
<body>
<div class="mainDiv" id=mailContainerDiv>
<table border=1 cellspacing=0 cellpadding=0 bordercolor="#0000FF" width=800px>
<thead>
<tr bgcolor="#EF380F" class="fixedHeaderTr">
<th colspan=11 >
<table width="100%" border=1 cellspacing=0 cellpadding=0 bordercolor="#0000FF">
<tr bgcolor="#EF380F">
<th rowspan=2 width="70">qrwewer</th>
<th colspan=2 width="100">werwer</th>
<th rowspan=2 width="70">werwer</th>
<th rowspan=2 width="70">werwer</th>
<th rowspan=2 width="70">werwer</th>
<th rowspan=2 width="70">werwer</th>
<th rowspan=2 width="70">werwer</th>
<th rowspan=2 width="70">werwer</th>
<th rowspan=2 width="70">werwer</th>
<th rowspan=2 width="70">werwer</th>
</tr>
<tr bgcolor="#00FF00">
<th width="50">rewwer</th>
<th width="50">werewr</th>
</tr>
</table>
</th>
</tr>
</thead>
<tbody>
<tr>
<td width="70">rewwerdddddddd</td>
<td width="50">werewrdddddddddd</td>
<td width="50">rewweddddddr</td>
<td width="70">werddddddddddewr</td>
<td width="70">rewdddddddddwer</td>
<td width="70">werdddddddddewr</td>
<td width="70">reddddddddddwwer</td>
<td width="70">werddddddewr</td>
<td width="70">rewdddddddddwer</td>
<td width="70">werdddddddddddewr</td>
<td width="70">rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td>werewrdddddddddd</td>
<td>rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
lijinsheng009 2010-01-28
- 打赏
- 举报
<tr class="fixedHeaderTr" bgcolor="#EF380F">
<th rowspan=2>qrwewer</th>
<th colspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
</tr>
<tr class="fixedHeaderTr" bgcolor="#00FF00" >
<th>rewwer</th>
<th>werewr</th>
</tr>
去掉 两个 class =“fixedHeaderTr” 就行 ，我试过了，可以，而且 跟你 想要的 需求 一样，是 可以 自动拉伸的，嘿嘿，多谢啊，学习哦，以前没有 遇到过 这样的问题，多谢了，嘿嘿
<th rowspan=2>qrwewer</th>
<th colspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
</tr>
<tr class="fixedHeaderTr" bgcolor="#00FF00" >
<th>rewwer</th>
<th>werewr</th>
</tr>
去掉 两个 class =“fixedHeaderTr” 就行 ，我试过了，可以，而且 跟你 想要的 需求 一样，是 可以 自动拉伸的，嘿嘿，多谢啊，学习哦，以前没有 遇到过 这样的问题，多谢了，嘿嘿
qustgjk 2010-01-28
- 打赏
- 举报
[Quote=引用 8 楼 smallbear923 的回复:]
class="fixedHeaderTr" 去掉它。。
[/Quote]
去掉就不能固定表头了。。。
class="fixedHeaderTr" 去掉它。。
[/Quote]
去掉就不能固定表头了。。。
xiaoxuanfengzjw 2010-01-28
- 打赏
- 举报
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title></title>
<style>
.fixedHeader {
position:relative ;
table-layout:fixed;
background:darkblue;
color:white;
border-style:solid;
border-top:1px;
border-color:gray;
top:expression(this.offsetParent.scrollTop);
z-index: 10;
}
.fixedHeader tr{
text-overflow:ellipsis;
overflow:hidden;
white-space: nowrap;
padding:1px;
}
.mainDiv
{
overflow:auto;
scrollbar-face-color:9999ff;
height:200px;
width:600px;
}
</style>
</head>
<body>
<div class="mainDiv" id=mailContainerDiv>
<table border=1 cellspacing=0 cellpadding=0 bordercolor="#0000FF" width=800px>
<thead >
<tr bgcolor="#EF380F" class="fixedHeader">
<th >qrwewer</th>
<th colspan=2><table align=center border=1 cellspacing=0 cellpadding=0 bordercolor="#0000FF" width="100%"><tr><td colspan=2>11111</td></tr><tr><td style="width:100px;">222</td><td style="width:100px;">333</td></tr></table></th>
<th >werwer</th>
<th >werwer</th>
<th >werwer</th>
<th >werwer</th>
<th >werwer</th>
<th >werwer</th>
<th >werwer</th>
<th >werwer</th>
</tr>
</thead>
<tbody>
<tr>
<td>rewwerdddddddd</td>
<td style="width:100px;word-wrap : break-word ;">werewrdddddddeeeeeddd</td>
<td style="width:100px;word-wrap : break-word ;">rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td style="width:100px;word-wrap : break-word ;">werewrdddddddeeeeeddd</td>
<td style="width:100px;word-wrap : break-word ;">rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr> <tr>
<td>rewwerdddddddd</td>
<td style="width:100px;word-wrap : break-word ;">werewrdddddddeeeeeddd</td>
<td style="width:100px;word-wrap : break-word ;">rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr> <tr>
<td>rewwerdddddddd</td>
<td style="width:100px;word-wrap : break-word ;">werewrdddddddeeeeeddd</td>
<td style="width:100px;word-wrap : break-word ;">rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title></title>
<style>
.fixedHeader {
position:relative ;
table-layout:fixed;
background:darkblue;
color:white;
border-style:solid;
border-top:1px;
border-color:gray;
top:expression(this.offsetParent.scrollTop);
z-index: 10;
}
.fixedHeader tr{
text-overflow:ellipsis;
overflow:hidden;
white-space: nowrap;
padding:1px;
}
.mainDiv
{
overflow:auto;
scrollbar-face-color:9999ff;
height:200px;
width:600px;
}
</style>
</head>
<body>
<div class="mainDiv" id=mailContainerDiv>
<table border=1 cellspacing=0 cellpadding=0 bordercolor="#0000FF" width=800px>
<thead >
<tr bgcolor="#EF380F" class="fixedHeader">
<th >qrwewer</th>
<th colspan=2><table align=center border=1 cellspacing=0 cellpadding=0 bordercolor="#0000FF" width="100%"><tr><td colspan=2>11111</td></tr><tr><td style="width:100px;">222</td><td style="width:100px;">333</td></tr></table></th>
<th >werwer</th>
<th >werwer</th>
<th >werwer</th>
<th >werwer</th>
<th >werwer</th>
<th >werwer</th>
<th >werwer</th>
<th >werwer</th>
</tr>
</thead>
<tbody>
<tr>
<td>rewwerdddddddd</td>
<td style="width:100px;word-wrap : break-word ;">werewrdddddddeeeeeddd</td>
<td style="width:100px;word-wrap : break-word ;">rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
<tr>
<td>rewwerdddddddd</td>
<td style="width:100px;word-wrap : break-word ;">werewrdddddddeeeeeddd</td>
<td style="width:100px;word-wrap : break-word ;">rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr> <tr>
<td>rewwerdddddddd</td>
<td style="width:100px;word-wrap : break-word ;">werewrdddddddeeeeeddd</td>
<td style="width:100px;word-wrap : break-word ;">rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr> <tr>
<td>rewwerdddddddd</td>
<td style="width:100px;word-wrap : break-word ;">werewrdddddddeeeeeddd</td>
<td style="width:100px;word-wrap : break-word ;">rewweddddddr</td>
<td>werddddddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddewr</td>
<td>reddddddddddwwer</td>
<td>werddddddewr</td>
<td>rewdddddddddwer</td>
<td>werdddddddddddewr</td>
<td>rewdddddrewr</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
smallbear923 2010-01-28
- 打赏
- 举报
class="fixedHeaderTr" 去掉它。。
smallbear923 2010-01-28
- 打赏
- 举报
<tr class="fixedHeaderTr" bgcolor="#EF380F">
<th rowspan=2>qrwewer</th>
<th colspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
<th rowspan=2>werwer</th>
把红色部分去掉，我发现就正常了。
qustgjk 2010-01-28
- 打赏
- 举报
120来了吗？
qustgjk 2010-01-28
- 打赏
- 举报
来人救命啊！
JavaAlpha 2010-01-28
- 打赏
- 举报
帮顶 没遇到过
在Dreamweaver里面的设计里面 看看
在Dreamweaver里面的设计里面 看看
yangbing694383929 2010-01-28
- 打赏
- 举报
帮顶！
huminghua 2010-01-28
- 打赏
- 举报
呵呵！帮顶！
qustgjk 2010-01-28
- 打赏
- 举报
补充说明，在thead的th中加入style=“positon:relative”是可以的，但是我还有一个表格拉伸功能，用relative就不行了，除了这种方法，大家给解决下！ 再次谢过！
