Question

垂直滚动有效，但水平没有。我的代码：

<html >

<body >
    <table style="  height:100%; width:100%">
        <tr>
            <td >
                <div style=" overflow:scroll; height:100%; width:100%">    
                    <table style="  width:2000px; height:2000px; ">
                    <tr><td></td></tr>
                    </table>     
                </div>
           </td>
        </tr>
    </table>
</body>
</html>

Answer 1

除非您想显示表格/目录，否则表格不是理想的元素。总是喜欢div而不是桌子。这应该在你的＆lt; body＆gt;

里面

<div style="height: 100%; width: 100%">
        <div style="overflow: scroll; height: 100%; width: 100%">
            <table style="width: 2000px; height: 2000px;">
                <tr>
                    <td>
                    </td>
                </tr>
            </table>
        </div>

使用表，你必须设置table-layout：fixed，

    <table style="height: 100%; width: 100%; table-layout:fixed">
        <tr>
            <td>
                <div style="overflow: scroll; height: 100%; width: 100%">
                    <table style="width: 2000px; height: 2000px;">
                        <tr>
                            <td style="width:50%; display:none">
                            </td>

                            <td style="width:50%; display:none">
                            </td>                     
                         </tr>
                         <tr>
                              <td>control here will auto-align to 50%</td>
                              <td>control here will auto-align to 50%</td>
                         </tr>
                    </table>
                    </div>
            </td>
        </tr>
    </table>

我修改了td模板。请注意。

Answer 2

我改变了你的代码

<html >
<body >
    <table style="  height:100%; width:100%">
        <tr>
            <td >
                <div style=" overflow:scroll; height:2000px; width:100%">    
                    <table style="  width:2000px; height:2000px; overflow:scroll;">
                    <tr><td></td></tr>
                    </table>     
                </div>
           </td>
        </tr>
    </table>
</body>
</html>

试试这个。它会起作用..

div的水平滚动不起作用

2 个答案: