在Webkit浏览器中使TBODY可滚动 [英] Make TBODY scrollable in Webkit browsers

问题描述

我知道

I'm aware of this question, but none of the answers work in Safari, Chrome, etc.

接受的策略（如此处所示）是设置tbody高度和溢出属性如下：

The accepted strategy (as demonstrated here) is to set the tbody height and overflow properties like so:

<table>
    <thead>
        <tr><th>This is the header and doesn't scroll</th></tr>
    </thead>
    <tbody style="height:100px; overflow:auto;">
        <tr><td>content that scrolls</td></tr>
        <tr><td>content that scrolls</td></tr>
        <tr><td>content that scrolls</td></tr>
        <tr><td>content that scrolls</td></tr>
        <tr><td>content that scrolls</td></tr>
        <tr><td>content that scrolls</td></tr>
        <tr><td>content that scrolls</td></tr>
    </tbody>
</table>

不幸的是，这在任何webkit浏览器都不起作用。有一个错误报告，它似乎不是一个高优先级（6月5日报告）。

Unfortunately, this does not work in any webkit browsers. There is a bug report about it that doesn't seem to be a high priority (reported June 05).

所以我的问题是：是否有替代策略确实有效？我尝试了两表方法，但是不可能保证标题将与内容一致。

So my question is: are there alternate strategies that do actually work? I've tried the two-table approach, but it's impossible to guarantee that the header will line up with the content. Do I just have to wait for Webkit to fix it?

推荐答案

这是一个工作示例：

http://www.imaputz.com/cssStuff/bigFourVersion.html

您必须将display：block添加到thead> tr和tbody

You have to add the display:block to the thead > tr and tbody

这篇关于在Webkit浏览器中使TBODY可滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！