Question

任何人都可以帮我解决使用css（没有js）在表上创建固定标题的问题。它需要支持动态数据，因为列大小来自db。只需要在ie7 / 8中工作。干杯

Answer 1

听起来像你正试图创建一个表格，你可以滚动身体部位并让第一（标题）行不动。这可以通过让一个表包含标题行，第二个放在<div style="max-height: 400px; overflow: auto;">内来完成 - 请注意，这只适用于固定宽度的列，除非您使用JavaScript。

如果这不是你想要达到的目的，请忽略这篇文章。

Answer 2

这就是我的想法：

<table>
    <thead>
        <tr>
            <th>Value</th>
        </tr>
    </thead>
    <tbody>
        <tr><td>1</td></tr>
        <tr><td>1</td></tr>
        <tr><td>1</td></tr>
        <tr><td>1</td></tr>
        <tr><td>1</td></tr>
        <tr><td>1</td></tr>
        <tr><td>1</td></tr>
        <tr><td>1</td></tr>
        <tr><td>1</td></tr>
        <tr><td>1</td></tr>
        <tr><td>1</td></tr>
        </tr>
    </tbody>
</table>

tbody {
    max-height:100px;
    overflow:auto;
    position:absolute;
}
tr td:last-child { /* do horizontal scrollbar useless */
    padding-right:1em;
}

编辑：raaah适用于IE8但不适用于IE7（使用IE9 beta测试），似乎IE7将高度规则应用于<td>元素！

Answer 3

如果您决定使用JS（因为我很确定使用纯粹的CSS几乎不可能），您可以尝试我的script。查看demo。它是跨浏览器并针对性能进行了优化。

CSS固定标题表中的ie

3 个答案: