Question

我在HTML表格单元格中有一个div，但是我不能让它填满整个单元格。

<body style="background-color: ButtonFace;">
        <form id="form1" runat="server">
            <table border="1" style="border-collapse:collapse; border-color:Red;">
                <tr>
                    <td>
                        <div style="border:solid 1px green;background-color: Yellow;">
                            test
                        </div>
                    </td>
                </tr>
            </table>
        </form>
    </body>

它有一个间隙，（灰色）背景透过。

enter image description here

我确信删除它一定很容易，但我无法弄清楚如何。

Answer 1

请申请

padding:0;

到td

或者您可以尝试使用

border-spacing

Answer 2

你必须为TD

设置填充0

 <body style="background-color: ButtonFace;">
            <form id="form1" runat="server">
                <table border="1" style="border-collapse:collapse; border-color:Red;">
                    <tr>
                        <td style="padding:0px"> <-- Change
                            <div style="border:solid 1px green;background-color: Yellow;">
                                test
                            </div>
                        </td>
                    </tr>
                </table>
            </form>
        </body>

Answer 3

您需要为表添加“cellpadding”并将其设置为“0”

<body style="background-color: ButtonFace;">
    <form id="form1" runat="server">
        <table cellpadding="0" border="1" style="border-collapse:collapse; border-color:Red;">
            <tr>
                <td >
                    <div style="border:solid 1px green;background-color: Yellow;">
                        test
                    </div>
                </td>
            </tr>
        </table>
    </form>
</body>

-Nick

在HTML5中使用div填充表格单元格

3 个答案: