Question

在td内我正在拿一张桌子，但不知怎的，桌子没有拿到td全高。任何人都可以帮我解决这个问题。

html for table：

<table style="height: auto">
        <tr>
            <td style="background-color: red">
                <table style="background-color: orange">
                    <tr>
                        <td>
                            <div style="height: 20px; width: 2px; background-color: black; vertical-align: top"></div>
                            <div style="height: 2px; width: 20px; background-color: black; vertical-align: bottom"></div>
                        </td>
                    </tr>
                    <tr style="height: 100%;">
                        <td>
                            <div style="height: 100%; width: 2px; background-color: black;"></div>
                        </td>
                    </tr>

                </table>
            </td>
            <td style="background-color: yellow">
                <table>
                    <tr>
                        <td>Description</td>
                    </tr>
                    <tr>
                        <td>Expression</td>
                    </tr>

                </table>
            </td>
        </tr>
    </table>

Answer 1

你不能强迫一个对象占据一个单元格高度的100％而不用编写一些能够计算出单元格高度的JavaScript并以编程方式调整表格的大小。

我不确定你的目标是什么，但你可以通过在td上设置背景并设置边框来获得红色轮廓来实现你想要的外观。

<table style="height: auto">
    <tr>
        <td style="background-color: orange; border: solid red 1px">
            <table>
                <tr>
                    <td>
                        <div style="height: 20px; width: 2px; background-color: black; vertical-align: top"></div>
                        <div style="height: 2px; width: 20px; background-color: black; vertical-align: bottom"></div>
                    </td>
                </tr>
                <tr style="height: 100%;">
                    <td>
                        <div style="height: 100%; width: 2px; background-color: black;"></div>
                    </td>
                </tr>
            </table>
        </td>
        <td style="background-color: yellow">
            <table>
                <tr>
                    <td>Description</td>
                </tr>
                <tr>
                    <td>Expression</td>
                </tr>

            </table>
        </td>
    </tr>
</table>

如果表高度为auto，则td内的元素不会占用td全高

1 个答案: