如何在 HTML 中设置表格单元格的最小宽度和最大高度？-css教程-PHP中文网

如何在 HTML 中设置表格单元格的最小宽度和最大高度？

Linda Hamilton

发布： 2024-10-25 02:36:02

原创

978 人浏览过

How to Set Min-Width and Max-Height for Table Cells in HTML?

定义表格单元格的最小宽度和最大高度

在 HTML 表格中，无法设置最小宽度和最大高度max-width 属性直接在表格单元格 (td) 上。 CSS 2.1 中此元素未定义此功能。

分辨率

您应该使用表格单元格的 width 属性，而不是使用 min-width 和 max-width 。例如：

<code class="css">td {
    width: 10px;
    border: 1px solid black;
}</code>

登录后复制

示例

要限制表格单元格内的内容宽度并防止过多的可用空间，请考虑以下修改后的 HTML 和 CSS 代码：

<code class="html"><html>
<head>
    <style type="text/css">
        td {
            border: 1px solid black;
        }

        html, body, .fullheight {
            height: 100%;
            width: 100%;
        }
        .minfield {
            width: 10px;
            border: 1px solid red;
            overflow: hidden;
        }
    </style>
</head>

<body>
    <table class="fullheight">
        <tr>
            <td class="minfield">
                <div class="minfield">
                    <p>hallo</p>
                </div>
            </td>
            <td><p>welt</p></td>
        </tr>
    </table>
</body>
</html></code>

登录后复制

附加说明

如果您在全屏模式下仍然遇到表格大小问题，请尝试在 CSS 中将表格布局属性设置为“固定” 。这将强制表格采用固定宽度布局，消除不必要的空白。

以上是如何在 HTML 中设置表格单元格的最小宽度和最大高度？的详细内容。更多信息请关注PHP中文网其他相关文章！