81

我有这张桌子:

<body>
    <table id="page" >
        <tr id="header" >
            <td colspan="2" id="tdheader" >je suis</td>
        </tr>
        <tr>
            <td>1</td>
            <td>2</td>
        </tr>
    </table>
</body>

这是CSS

html, body, #page {
    height:100%;
    width:100%;
    margin:0;
    padding:0;
}

#header {
    margin:0;
    padding:0;
    height:20px;
    background-color:green;
}

我想删除所有边距和填充,但我总是有:

在此处输入图像描述

我该如何解决这个问题?

4

7 回答 7

149

尝试使用这个 CSS:

/* Apply this to your `table` element. */
#page {
   border-collapse: collapse;
}

/* And this to your table's `td` elements. */
#page td {
   padding: 0; 
   margin: 0;
}
于 2013-05-07T20:27:59.850 回答
21

尝试这个:

table { 
border-spacing: 0;
border-collapse: collapse;
}
于 2014-09-18T14:24:21.587 回答
7

使用显示块

style= "display: block";
于 2018-08-17T10:31:56.190 回答
6

表格是奇数元素。与divs 不同,它们有特殊的规则。添加cellspacingcellpadding属性,设置为0,它应该可以解决问题。

<table id="page" width="100%" border="0" cellspacing="0" cellpadding="0">
于 2014-12-08T14:40:49.160 回答
6

尝试使用标签正文删除所有你想要的边距和填充。

<body style="margin: 0;padding: 0">
    <table border="1" width="100%" cellpadding="0" cellspacing="0" bgcolor=green>
        <tr>
            <td >&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td >&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td >&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
    </table>
</body>
于 2017-02-06T13:38:15.403 回答
3

删除表格内单元格之间的填充。只需在 table 标记中使用cellpadding=0cellspacing=0属性。

于 2013-05-07T20:28:30.627 回答
3

我发现最完美的答案是这个

.noBorder {
    border: 0px;
    padding:0; 
    margin:0;
    border-collapse: collapse;
}
于 2016-06-01T10:56:49.427 回答