本人最近做表格的固定表头时发现，如果表格的表头具有多行，用到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>
<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>
<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>
把红色部分去掉，我发现就正常了。
<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>
<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” 就行 ，我试过了，可以，而且 跟你 想要的 需求 一样，是 可以 自动拉伸的，嘿嘿，多谢啊，学习哦，以前没有 遇到过 这样的问题，多谢了，嘿嘿
<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>
弄了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行就脱离了表格的常规布局。不再是以前的行，是可以随意飘动的。所以跨行的文字就只有一半了。所以只能用一行了，一行你可以在里面随意放些东西都是可以的。
<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>