jquery 设置表格行的最大高度

mgdq6dx1 于 2022-11-03 发布在 jQuery

关注(0)|答案(4)|浏览(216)

我有一个从数据库加载到HTML表的SQL表。一些列包含许多行的信息，现在所有的行都显示出来了，这使得行太高了。我想设置一行的最大高度，我已经用CSS设置了高度，但它不起作用。

table tbody tr 
{
    max-height: 20px;
}

有人能帮忙吗？谢谢

jquery

来源：https://stackoverflow.com/questions/51986556/setting-maximum-height-of-table-row

4条答案

按热度按时间

os8fio9y1#

您可以为整个表格添加一个类（在本例中为variable-rows），这将有助于将样式仅应用于此表格的行。并且将样式应用于表格中的所有行，而无需为每一行添加类：
第一个

赞(0）回复(0）举报 2022-11-03

kiayqfof2#

尝试以下HTML代码

<table style="border: 1px solid red">
    <thead>
        <tr>
            <td>Header stays put, no scrolling</td>
        </tr>
    </thead>
    <tbody style="display: block; border: 1px solid green; height: 30px; overflow-y: scroll">
        <tr>
            <td>cell 1/1</td>
            <td>cell 1/2</td>
        </tr>
        <tr>
            <td>cell 2/1</td>
            <td>cell 2/2</td>
        </tr>
        <tr>
            <td>cell 3/1</td>
            <td>cell 3/2</td>
        </tr>
    </tbody>
 </table>

我希望这对你有帮助。

赞(0）回复(0）举报 2022-11-03

slmsl1lt3#

另一个可以尝试的解决方法是更改表行或其他表元素的显示
下面是一个简单的例子，如何可以工作，但你可能需要做大量的风格调整，由于它
在下面的示例中，我将表行的显示更改为flex
第一个

赞(0）回复(0）举报 2022-11-03

aemubtdh4#

您可以轻松地将“height”属性设置为“tr”标记，如下所示：