当前位置: 首页 > 面试题库 >

使TBODY在Webkit浏览器中可滚动

宰父熙云
2023-03-14
问题内容

我知道这个问题,但所有答案都无法在Safari,Chrome等系统中使用。

可接受的策略(如此处所示)是设置tbody的高度和溢出属性,如下所示:

<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日报道)。

所以我的问题是:是否有其他有效的替代策略?我尝试了两表方法,但是无法保证标题与内容对齐。我是否只需要等待Webkit对其进行修复?


问题答案:

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



 类似资料:
  • 问题内容: 当我有一个带有可滚动内容的网页时。使用css属性“ overflow:auto”或“ overflow:visible”,滚动条在桌面浏览器上可见,但是当我在移动浏览器上打开页面时,滚动条仅在尝试滚动时出现。有没有一种方法可以使滚动条在移动设备上始终可见?我尝试了一些JQuery库,但是都没有用。 html代码是微不足道的,我有一个带有IFrame的可滚动div: CSS: 问题答案:

  • 问题内容: 我具有使用以下CSS应用的阴影效果: 有谁知道其他浏览器的等效功能。 请注意,我无法使用,因为这不会在形状的css箭头部分周围应用阴影效果 问题答案: 好的,我已经弄清楚了-Opera和firefox的等效项是: drop-shadow.svg如下所示: IE太糟糕了,不支持svg值feOffset,feFlood或feMerge,因此当前没有等价物 我将保留这种开放性,以防有人弄清楚

  • 问题内容: 我已经创建了一个简单的 应用程序(使用),带有联系表单,当用户单击“提交”时,我想生成并发送电子邮件。为此,我一直试图像这样使用: …但是我在导入过程中遇到了很多错误。 我是否在这里缺少某些东西,或者根本不是为在浏览器中使用而设计的?如果是这种情况,我应该考虑其他选择吗? 问题答案: node.js用于服务器端JavaScript,它允许您执行浏览器无法完成的许多工作。 除了mailt

  • 问题内容: 在Selenium选项(在Firefox上)中,我可以找到 。 是否可以使用此选项在 Chromium浏览器 (而非Chrome)中运行Selenium测试? 问题答案: 是。用于镀铬 您可以使用的其他选项是 custom, chrome(注意:这不是Google chrome,仅适用于Firefox模式), googlechrome, iexplore。请查看硒文档以获取模式的完整列

  • 问题内容: 如何定义跨浏览器的CSS滚动条样式?我测试了此代码,它仅在IE和Opera中起作用,但在Chrome,Safari和Firefox中失败。 问题答案: 滚动条CSS样式是Microsoft开发人员发明的一种奇怪方法。它们不是CSS的W3C标准的一部分,因此大多数浏览器只是忽略它们。

  • 问题内容: 我正在使用原始html和JQuery讨论一些想法。我所做的一件事是创建一个包含一组行的表元素。 但是,当我在FireFox + Firebug,IE8开发人员工具栏或Google Chrome JavaScript调试器中查看代码时,所有这些都表明在所有 tr* 节点周围都存在一个 tbody 元素。 * 我不反对这种情况……但这是标准行为吗? 问题答案: TBODY元素定义表中的一组