Question

我试图在一个包含thead，tbody和tfoot的表的页面上创建一个小部件。因为我不希望窗口小部件变得太大，如果tbody的长度大于200px，那么我希望表格中的行可以滚动。

我正在使用jQuery 1.9.1，但如果可能的话，我更喜欢纯CSS / HTML解决方案。

有没有人有一个非常简单的解决方案？

Answer 1

您将使用overflow css声明。

<!DOCTYPE html>
<html>
<head>

</head>
<body>
<div id="wrapper" style="height:100px;width:100px;overflow:auto;">
<div id="widget">

<table>
<tbody>
    <tr>
        <td>blah</td>
        <td>blah</td>
        <td>blah</td>
        <td>blah</td>
        <td>blah</td>
        <td>blah</td>   
    </tr>
    <tr>
        <td>more blah</td>
        <td>etc</td>
        <td>etc</td>
        <td>etc</td>
        <td>etc</td>
        <td>etc</td>    
    </tr>
    <tr>
        <td>blah</td>
        <td>blah</td>
        <td>blah</td>
        <td>blah</td>
        <td>blah</td>
        <td>blah</td>   
    </tr>
</tbody>
</table>

</div>


</div>




</body>
</html>

页眉和页脚内部的可滚动表体

1 个答案: