Question

这是我目前的表格，当用户向上或向下滚动时，有没有办法让这个表随页面移动？

<table width="800" border="1" cell="" spacing="2" bgcolor="#336699">
    <tr>
        <th width="0" bgcolor="#CCCCCC">Name</th>
        <th width="0" bgcolor="#CCCCCC">Toll Free Number</th>
        <th width="0" bgcolor="#CCCCCC">Toll Free Number International</th>
        <th width="0" bgcolor="#CCCCCC">Conference ID</th>
        <th width="0" bgcolor="#CCCCCC">Moderator Pin</th>
    </tr>
    <!-- more -->
</table>

Answer 1

这个问题可以帮助您弄清楚发生了什么：CSS to keep element at "fixed" position on screen 基本上，正如有人也评论过，您想要考虑要添加到表中的元素。这是有用的东西：

<table width="800" border="1" cell="" spacing="2" bgcolor="#336699">
        <tr>
            <th width="0" bgcolor="#CCCCCC">Name</th>
            <th width="0" bgcolor="#CCCCCC">Toll Free Number</th>
            <th width="0" bgcolor="#CCCCCC">Toll Free Number International</th>
            <th width="0" bgcolor="#CCCCCC">Conference ID</th>
            <th width="0" bgcolor="#CCCCCC">Moderator Pin</th>
        </tr>
        <!-- more -->
    </table>
    <div>
    </div>

CSS：

div{
  height: 4000px;
}

table{
  position:fixed;
}

小提琴：https://jsfiddle.net/xzyvsx00/

Answer 2

假设您根本不使用CSS，则可以设置“普通”html页面以获得所需的行为：

<html>
    <head></head>
    <body>
        <h1>some content</h1>
        <p>some other content</p>
        <div>
            <table width="800" border="1" cell="" spacing="2" bgcolor="#336699">
                <tr>
                    <th width="0" bgcolor="#CCCCCC">Name</th>
                    <th width="0" bgcolor="#CCCCCC">Toll Free Number</th>
                    <th width="0" bgcolor="#CCCCCC">Toll Free Number International</th>
                    <th width="0" bgcolor="#CCCCCC">Conference ID</th>
                    <th width="0" bgcolor="#CCCCCC">Moderator Pin</th>
                </tr>
        <!-- more -->
            </table>
        </div>
    </body>
</html>

这将使表格滚动到页面的其余部分。因此，如果它没有，你在页面中有一个css定义，使其变得粘滞

Answer 3

您可以在CSS上将表格设置为position:fixed。这使得元素相对于视口定位。

如果您没有CSS文件，您的代码将是这样的：

<table width="800" border="1" cell="" spacing="2" bgcolor="#336699" style="position:fixed;">
    <tr>
        <th width="0" bgcolor="#CCCCCC">Name</th>
        <th width="0" bgcolor="#CCCCCC">Toll Free Number</th>
        <th width="0" bgcolor="#CCCCCC">Toll Free Number International</th>
        <th width="0" bgcolor="#CCCCCC">Conference ID</th>
        <th width="0" bgcolor="#CCCCCC">Moderator Pin</th>
    </tr>
<!-- more -->
</table>

我建议您查看本教程以更好地了解基本定位：http://learnlayout.com

当用户向上或向下滚动时，如何使表格随页面移动？

3 个答案: