0

我有一个简单的 div 标签：我需要将 thead 固定在 tbody 上方。我需要将它们放在同一个 div、同一个表中。使用下面的代码，我的标题在正文上方。我怎样才能将 tbody 向下推几个槽口，所以当我滚动时，标题是固定的，只有身体移动

<div STYLE=" height: 120px; width: 100px; font-size: 12px; overflow: auto;">
  <table bgcolor="green">
    <thead style="position:fixed;">
        <tr><td bgcolor="#fafafa">hello</td></tr>
    </thead>
    <tbody >
   <tr><td bgcolor="#dadada">www.hioxindia.com</td></tr>
   <tr><td >maths.hscripts.com</td></tr>
   <tr><td bgcolor="#dadada">www.hscripts.com</td></tr>
   <tr><td>free php scripts</td></tr>
   <tr><td bgcolor="#dadada">www.hiox4u.com</td></tr>
   </tbody>
</table>
</div>

必须在 IE 上工作 对于上述 div... 我需要在表格顶部添加带有固定标题的滚动条。中间不应包含额外的 div 或表格。我需要 thead 和 tbody 在同一个表中

4

2 回答 2

2

以您的代码为基础，这是我在 Chrome 和 IE10 中测试过的一个 jsfiddle，它至少在那里工作。

JSFiddle：http: //jsfiddle.net/YbQzF/

代码：

<div STYLE=" height: 120px; width: 100px; font-size: 12px; overflow: auto;">
  <table bgcolor="green">
    <thead style="position: fixed">
        <tr><td bgcolor="#fafafa">hello</td></tr>
    </thead>
    <tbody style="overflow:scroll; max-height:100px; position:absolute; top:20px;">
   <tr><td bgcolor="#dadada">www.hioxindia.com</td></tr>
   <tr><td >maths.hscripts.com</td></tr>
   <tr><td bgcolor="#dadada">www.hscripts.com</td></tr>
   <tr><td>free php scripts</td></tr>
   <tr><td bgcolor="#dadada">www.hiox4u.com</td></tr>
   <tr><td>free php scripts</td></tr>
   <tr><td bgcolor="#dadada">www.hiox4u.com</td></tr>
   <tr><td>free php scripts</td></tr>
   <tr><td bgcolor="#dadada">www.hiox4u.com</td></tr>
...
   </tbody>
</table>
</div>​
于 2012-11-19T21:48:34.207 回答
0 
table { margin-top:-3em; }
thead { margin-top:-2em; }

在我的计算机上的 FF 和 Chrome 中工作。这是可怕和骇人听闻的，我不同意这个消息，但它有效。

于 2012-11-19T20:36:14.150 回答