Question

<html>
<head>
    <style>
        html {
            overflow: scroll;
        }

        table {
            width: 500px;
            display: block;
            background: gray;
            margin: 0 auto;
        }

        tbody {
            overflow: auto;
        }

        td {
            padding: 50px;
        }

    </style>
</head>
<body>
<table id="results_body">
    <tbody class="content" style="display: block;">
    <tr>
        <th>HEADER</th>
        <th>HEADER</th>
        <th>HEADER</th>
        <th>HEADER</th>
        <th>HEADER</th>
        <th>HEADER</th>
        <th>HEADER</th>
        <th>HEADER</th>
    </tr>
    <tr>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
    </tr>
    <tr>


        <td>2</td>
        <td>2</td>
        <td>2</td>
        <td>2</td>
        <td>2</td>
        <td>2</td>
        <td>2</td>
        <td>2</td>
    </tr>
    <tr>


        <td>3</td>
        <td>3</td>
        <td>3</td>
        <td>3</td>
        <td>3</td>
        <td>3</td>
        <td>3</td>
        <td>3</td>
    </tr>
    <tr>


        <td>4</td>
        <td>4</td>
        <td>4</td>
        <td>4</td>
        <td>4</td>
        <td>4</td>
        <td>4</td>
        <td>4</td>
    </tr>
    <tr>


        <td>5</td>
        <td>5</td>
        <td>5</td>
        <td>5</td>
        <td>5</td>
        <td>5</td>
        <td>5</td>
        <td>5</td>
    </tr>
    <tr>


        <td>6</td>
        <td>6</td>
        <td>6</td>
        <td>6</td>
        <td>6</td>
        <td>6</td>
        <td>6</td>
        <td>6</td>
    </tr>
    <tr>


        <td>7</td>
        <td>7</td>
        <td>7</td>
        <td>7</td>
        <td>7</td>
        <td>7</td>
        <td>7</td>
        <td>7</td>
    </tr>
    </tbody>
</table>
</body>
</html>

当表格的水平滚动条不在视图中时（如随附的sc所示），该问题不便于滚动表格。我要实现的是允许用户使用主滚动条（主体滚动条）滚动页面中包含表格的所有内容，或将水平滚动条保持在视图中，这有点棘手，因为我将有很多{{1 }}，我无法将它们包装在tbody中。谢谢进阶

Answer 1

请勿在表格中设置滚动条。在html正文中进行设置。

body {
            overflow: auto;
        }

使用主滚动条滚动页面中的所有元素

1 个答案: